Products

Data Converter Cleaner TUC - Unit Converter Import Export Survey Manager Tweet Controller

Developer

Article Blog Forum Interview Beginner News Startup Quiz

Users

Career

Apply Job Internship

Pricing

Login Sign Up Get a Quote

How to create Optgroup In Dropdownlist .Net MVC 4‎?

Anonymous User 4177 11 Feb 2015

How to create Optgroup In Dropdownlist .Net MVC 4‎?

Anonymous User

Other

I am a content writter !

1 Answers

Tom Cruser 11 Feb 2015

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:

MindStick Training