Home > DeveloperSection > Forums > How to create Optgroup In Dropdownlist .Net MVC 4‎?
Chris S
Chris S

Total Post:48

Points:336
Posted on    February-11-2015 7:09 AM

 .NET .NET  Mvc4 
Ratings:


 1 Reply(s)
 1442  View(s)
Rate this:
How to create Optgroup In Dropdownlist .Net MVC 4‎?


Tom Cruser
Tom Cruser

Total Post:28

Points:196
Posted on    February-11-2015 7:15 AM

First need to create database context.

MvcApplication1.Models.Database1Context db = new MvcApplication1.Models.Database1Context();
    var data = db.locations.ToList().Select(t => new GroupedSelectListItem
    {
        GroupKey = t.location_group_id.ToString(),
        GroupName = t.location_group.name,
        Text = t.name,
        Value = t.id.ToString()
    });

Razor View:
@Html.DropDownGroupListFor(m => m.location_id, data, "-- Select --", new { 
            @data_val = "true",  // for Required Validation
            @data_val_required = "The Name field is required." // for Required Validation
        })


Fill static data:
IEnumerable<GroupedSelectListItem> item;
    item = new List<GroupedSelectListItem> { 
        new GroupedSelectListItem() { Value="volvo", Text="Volvo", GroupName="Swedish Cars", GroupKey="1", Disabled=true },
        new GroupedSelectListItem() { Value="saab", Text="Saab",GroupName="Swedish Cars", GroupKey="1" }, 
        new GroupedSelectListItem() { Value="mercedes", Text="Mercedes", GroupName="German Cars", GroupKey="2" },
        new GroupedSelectListItem() { Value="audi", Text="Audi", GroupName="German Cars", GroupKey="2",Selected=true }};
Razor View:
@using (Ajax.BeginForm("Index", null, new AjaxOptions { HttpMethod = "post" }, new { id = "frm" }))
    {
        @Html.DropDownGroupList("Cars", item, "-- Select Car --", 
            new Dictionary<string, object>() { 
                { "data-val", "true" }, 
                { "data-val-required", "The Car field is required." } 
            })
        <input type="submit" name="name" value="Send" />
    }


Output:




Don't want to miss updates? Please click the below button!

Follow MindStick