传递剃刀HTML帮助数据图标属性 [英] pass data-icon attributes in razor html helper

问题描述

我想下面的HTML code。使用asp.net MVC 3剃须刀的HTML帮助：

I want to following html code using asp.net mvc 3 razor html helper:

<input type="text" .... .   placeholder="Login" data-icon="user" />

我试试这个：

@Html.TextBoxFor(m => m.UserName, new { placeholder = "Login", data-icon = "user" })

或

@Html.TextBoxFor(m => m.UserName, new { placeholder = "Login", @data-icon = "user" })

显示错误：

Invalid anonymous type members declaration.

这可能是由于在没有采取作为属性数据图标冲。我怎么可以添加数据图标属性的文本框字段。

This might due to dash in data-icon not taken as attributes. How could I add data-icon attributes in text box field.

推荐答案

是的，你可以不写这样的，但你可以编写自己的扩展来解决这个问题。下面是示例code：

Yes, you can't write like that but you can write your own Extension to solve this problem. Here is the sample code:

public static MvcHtmlString MyInput(this HtmlHelper htmlHelper, string name, string value, string icon)
    {
        var attrs = new Dictionary<string,object>();
        attrs.Add("data-icon", icon);
        return htmlHelper.TextBox(name, name, value, attrs);
    }

或者你也可以使用剃须刀这样的：

Or you can also use in razor like this:

@{
    var attrs = new Dictionary<string, object>();
    attrs.Add("placeholder","Login"); 
    attrs.Add("data-icon","user");
}
@Html.TextBoxFor(m => m.UserName, attrs)

PLZ不要忘记，以纪念它是正确的答案，如果它可以帮助你： - ）

Plz don't forget to mark it's right answer if it helps you :-)

这篇关于传递剃刀HTML帮助数据图标属性的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！