Add html5 attributes to form inputs using razor

Question

@Html.TextBox("UserName", null, new { /* ... */ })

How would i add properties like data-foo="bar" and required to the htmlattributes object?

Thanks

krolik · Accepted Answer · 2012-08-11 11:19:18Z

6

If you are using MVC3 you can use underscores in your html attributes, they are converted to dashes

@Html.TextBox("UserName", null, new { data_foo = "bar", required = "" })

html result

<input data-foo="bar" id="UserName" name="UserName" required="" type="text" value="">

Second option. Use dictionary instead of anonymous object

@Html.TextBox("UserName", null, new Dictionary<string, object> { {"data-foo", "bar"}, {"required", ""} })

answered Aug 11, 2012 at 11:19

krolik

5,8121 gold badge29 silver badges30 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Is it possible to add a key without a value in the object? Since the required markup is required and not required=""?

But required="" is also proper syntax. Look HTML5 required Attribute