Is there anyway to have a SelectList prepopulated on ViewModel with data-attributes ?
I want to do
@Html.DropdownListFor(m=> m.CityId, Model.Cities);
so it generates code like :
<select id="City" class="location_city_input" name="City">
<option data-geo-lat="-32.522779" data-geo-lng="-55.765835" data-geo-zoom="6" />
<option data-geo-lat="-34.883611" data-geo-lng="-56.181944" data-geo-zoom="13" data-geo-name="Montevideo" data-child=".state1" value="1">Montevideo</option>
<option data-geo-lat="-34.816667" data-geo-lng="-55.95" data-geo-zoom="13" data-geo-name="Canelones, Ciudad de la Costa" data-child=".state41" value="41">Ciudad de la Costa</option>
</select>
Here's how I ended up doing it without an extension but still enabling unobtrusive validation to continue to work & be bound to a ViewModel property.
Created an Html Helper to get the validation attributes as a string:
Use this helper in a
select
list in the view:This would output something like this:
I will leave the conditional
data-
attributes up to you since those are just a matter of forming the appropriate Razor expressions.I had a similar requirement, I created a extension. Hope it helps for the ones who wants to create an extension.
MVC when it converts object names to attribute names, it relaces "_" with "-", so its:
NOT MY ANSWER, ANSWER CREDIT GOES TO About bruce (sqlwork.com) from the ASP>NET Forums.
How can I add data-rel="selected" attribute into dropdownlistfor htmlAttributes?
JUST WANTED TO HELP OUT AS THIS SAVED ME FROM CODING A HACK! ENJOY.
Here's the simple solution.
Not everything has to be written with extension method in .NET code. One of the great things about MVC is it gives you easy access to construct your own HTML.
With MVC4 you can get the id and name of the element on the expression tree with the helpers
HTML.NameFor
andHTML.IdFor
Assuming
Model.Cities
is a collection of items that expose each of those properties. Then you should be all set.If you want reusability, consider making it an editor template for anything that is an Enumerable of Cities
You'll have to extend SelectListItem, and then extend DropDownListFor to use the extended SelectListItem.
Have a look at this solution:
Adding html class tag under <option> in Html.DropDownList