https://github.com/bhaumikpatel/ddl.optgroup.mvc.demo

HTML5 <optgroup> tag in MVC
https://github.com/bhaumikpatel/ddl.optgroup.mvc.demo

Last synced: 7 days ago
JSON representation

HTML5 <optgroup> tag in MVC

• Host: GitHub
• URL: https://github.com/bhaumikpatel/ddl.optgroup.mvc.demo
• Owner: bhaumikpatel
• Created: 2014-01-27T14:51:10.000Z (almost 11 years ago)
• Default Branch: master
• Last Pushed: 2014-01-27T16:43:10.000Z (almost 11 years ago)
• Last Synced: 2024-12-12T06:56:39.354Z (12 days ago)
• Language: JavaScript
• Homepage: http://bhaumikpatel.github.io/DDL.optgroup.MVC.Demo/
• Size: 7.22 MB
• Stars: 3
• Watchers: 3
• Forks: 1
• Open Issues: 4
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
HTML5 <optgroup> tag in MVC

=====================

There is no built-in support in the framework for this kind of drop down lists.

----------

Nuget Package [ DropDownList.Optgroup.MVC](http://www.nuget.org/packages/DropDownList.Optgroup.MVC/)

---------

To install *DDL.optgroup.MVC*, run the following command in the Package Manager Console

> **PM> Install-Package DropDownList.Optgroup.MVC**

#### **Document** - Using 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

        })

```

#### **Document** - Using Static Data

```

    IEnumerable item;

    item = new List { 

        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() { 

                { "data-val", "true" }, 

                { "data-val-required", "The Car field is required." } 

            })

        

    }

```

**HTML**

```

    

        -- Select Car --

        

            Volvo

            Saab

        

        

            Mercedes

            Audi

        

    

```

**Output**

-- Select Car --

Volvo

Saab

Mercedes

Audi