3

我想使用 asp.net mvc 3 razor html helper 来跟踪 html 代码：

<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.

这可能是由于数据图标中的破折号没有被视为属性。如何在文本框字段中添加数据图标属性。

4

3 回答 3

14

尝试这个

@Html.TextBoxFor(m => m.UserName, new { placeholder = "Login", data_icon = "user" })
于 2013-03-13T08:57:18.440 回答
9

是的，你不能那样写，但你可以编写自己的扩展来解决这个问题。这是示例代码：

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);
    }

或者你也可以像这样在剃须刀中使用：

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

如果它对你有帮助，请不要忘记标记它的正确答案:-)

于 2012-07-23T04:33:06.063 回答
4

这实际上与 vNext 的第二个替代方案相同，但如果您更喜欢内联编写它：

@Html.TextBoxFor(m => m.UserName, new Dictionary<string, object> { { "placeholder", "Login" }, { "data-icon", "user" } })
于 2012-10-30T13:20:42.537 回答