HTML5 data-* attributes and MVC3
If you are using any of the new fun features of HTML5 you probably stumbled across the data-* attributes which also makes jQuery so much more powerful as well.
Example markup:
<a href="#" data-number="">Some Text</a>
And in jQuery:
var number = $("a").data("number");
Now enter the world of MVC3 and object htmlAttributes, at first glance you might try doing this
@Html.ActionLink("Back to Profile", "Index", null, new { data-role="button", data-icon="check" });
But you will soon find out that does not work:
Compilation Error
Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately. Compiler Error Message: CS0746: Invalid anonymous type member declarator. Anonymous type members must be declared with a member assignment, simple name or member access. Source Error:
Line 8: </p> Line 9: Line 10: @Html.ActionLink("Back to Profile", "Index", null, new { data-role="button", data-icon="check" }); Line 11: Line 12: <a href="#" data-number="">Some Text</a>
Thankfully the MVC team took care of this issue, all you need to do is do data_role and it will render as data-role
@Html.ActionLink("Back to Profile", "Index", null, new { data_role="button", data_icon="check" });
Simple but if not known could cause a world of hurt!