SelectListItem with data-attributes

by

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 and HTML.IdFor

<select name="@Html.NameFor(Function(model) model.CityId)"
        id="@Html.IdFor(Function(model) model.CityId)"
        class="location_city_input">
    @For Each city In Model.Cities
        @<option value="@city.Value"
                 @(If(city.Value = Model.CityId, "selected", ""))
                 data-geo-lat="@city.Lat"
                 data-geo-lng="@city.Lng"
                 data-geo-zoom="@city.Zoom">
            @city.Text
        </option>
    Next
</select>

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

More Related Contents:

  1. How to use dashes in HTML-5 data-* attributes in ASP.NET MVC
  2. MVC5 – How to set “selectedValue” in DropDownListFor Html helper
  3. There is no ViewData item of type ‘IEnumerable’ that has the key ‘xxx’
  4. Html5 Placeholders with .NET MVC 3 Razor EditorFor extension?
  5. How can I combine two fields in a SelectList text description?
  6. Html helper for
  7. Html5 data-* with asp.net mvc TextboxFor html attributes
  8. MVC Datatype Currency trigger numeric keypad
  9. How to link HTML5 form action to Controller ActionResult method in ASP.NET MVC 4
  10. What is the best ways to bind @Html.DropDownListFor in ASP.NET MVC5?
  11. Set disable attribute based on a condition for Html.TextBoxFor
  12. Using an MVC HtmlHelper from a WebForm
  13. Is there an ASP.NET MVC HtmlHelper for image links?
  14. How to set default value to select list in MVC during run time
  15. Steve Sanderson’s BeginCollectionItem helper won’t bind correctly
  16. How can I add an item to a SelectList in ASP.net MVC
  17. Polymorphic model binding
  18. jQuery find element by data attribute value
  19. Razor-based view doesn’t see referenced assemblies
  20. ASP.NET: This method cannot be called during the application’s pre-start initialization stage
  21. Could not load file or assembly HRESULT: 0x80131515 (When adding controller to MVC project that has assembly references on network drive)
  22. MVC Routing Parameter Precedence
  23. AWS Elastic Beanstalk environment variables in ASP.NET Core 1.0
  24. How do you set the startup page for debugging in an ASP.NET MVC application?
  25. Entity Framework Include OrderBy random generates duplicate data
  26. How to do a ASP.NET MVC Ajax form post with multipart/form-data?
  27. How does a method in MVC WebApi map to an http verb?
  28. Why is ValidateInput(False) not working?
  29. Inject repository to custom membership provider with Ninject
  30. Get [DisplayName] attribute of a property in strongly-typed way

Leave a Comment