Html5 data-* with asp.net mvc TextboxFor html attributes

Question

How do I add data-* html attributes using TextboxFor?

This is what I currently have:

@Html.TextBoxFor(model => model.Country.CountryName, new { data-url= Url.Action("CountryContains", "Geo") })

As you see, the - is causing a problem here data-url. Whats the way around this?

Answer 1

You could use underscore (_) and the helper is intelligent enough to do the rest:

@Html.TextBoxFor(
    model => model.Country.CountryName, 
    new { data_url = Url.Action("CountryContains", "Geo") }
)

And for those who want to achieve the same in pre ASP.NET MVC 3 versions they could:

<%= Html.TextBoxFor(
    model => model.Country.CountryName, 
    new Dictionary<string, object> { 
        { "data-url", Url.Action("CountryContains", "Geo") } 
    }
) %>