connectseekers.com

Wednesday, 13 August 2014

Display DropdownList Item By Group in Asp.Net MVC Using C#.Net

8/13/2014 - By Pranav Singh 0

This article will show you how you can bind and display the dropdown list value in group form in asp.net mvc application using C#.net and how you can retrieve selected value of the dropdown list in asp.net.

Some of my previous articles are as follows: C# Conversion of DateTime to 24 Hours Time in Asp.Net | Display 24 Hour Time In DropDownList In Asp.net, jQuery DatePicker Calendar With Dropdown Month and Year in Asp.Net, Load Partial View By Selecting Value in Dropdown Using C# in Asp.net MVC, Bind DropDownList Using Entity Framework in ASP.Net MVC Using C#, DropDownList Bind By Using XmlDataSource in Asp.Net.
So for this article first we will create a new asp.net mvc application in this we first we will create a new model class.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MvcApplication5.Models
{
    public class DropdownModel
    {
        public List<Parent> DropdownDataModel { get; set; }
        public List<Parent> ParentDataModel { get; set; }
        public List<Clild> ClildDataModel { get; set; }
        public int SelectedValue { get; set; }
    }
    public class Parent
    {
        public int ParentId { get; set; }
        public string ParentName { get; set; }
    }
    public class Clild
    {
        public int ParentId { get; set; }
        public int ChildId { get; set; }
        public string ChildName { get; set; }

    }
}

Now we will create controller. In this we will add the add the get and post method code.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication5.Models
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            DropdownModel objdropdownmodel = new DropdownModel();
            objdropdownmodel.ParentDataModel = new List<Parent>();
            objdropdownmodel.ParentDataModel = GetParentData();
            objdropdownmodel.ClildDataModel = new List<Clild>();
            objdropdownmodel.ClildDataModel = GetClildData();
            return View(objdropdownmodel);
        }
        [HttpPost]
        public ActionResult Index(int TeavelMode)
        {
            DropdownModel objdropdownmodel = new DropdownModel();
            objdropdownmodel.ParentDataModel = new List<Parent>();
            objdropdownmodel.ParentDataModel = GetParentData();
            objdropdownmodel.ClildDataModel = new List<Clild>();
            objdropdownmodel.ClildDataModel = GetClildData();
            objdropdownmodel.SelectedValue = TeavelMode;
            ViewBag.SelectedValue = "Selected Value :" + objdropdownmodel.ClildDataModel.Where(m => m.ChildId == TeavelMode).FirstOrDefault().ChildName;
            return View(objdropdownmodel);
        }
        ///

        /// You can use DB to access data for this section
            ///
        public List<Parent> GetParentData()
        {
            List<Parent> objparent = new List<Parent>();
            objparent.Add(new Parent { ParentId = 1, ParentName = "--Car--" });
            objparent.Add(new Parent { ParentId = 2, ParentName = "--Bike--" });
            return objparent;
        }
        ///

        /// You can use DB to access the data
        ///

        ///
        public List<Clild> GetClildData()
        {
            List<Clild> objchild = new List<Clild>();
            objchild.Add(new Clild { ParentId = 1, ChildId = 1, ChildName = "Honda City" });
            objchild.Add(new Clild { ParentId = 1, ChildId = 2, ChildName = "Vento Polo" });
            objchild.Add(new Clild { ParentId = 1, ChildId = 3, ChildName = "Audy" });
            objchild.Add(new Clild { ParentId = 1, ChildId = 4, ChildName = "Honda Amaze" });
            objchild.Add(new Clild { ParentId = 2, ChildId = 5, ChildName = "CBR 250" });
            objchild.Add(new Clild { ParentId = 2, ChildId = 6, ChildName = "CBR 150" });
            objchild.Add(new Clild { ParentId = 2, ChildId = 6, ChildName = "Pulsar 200" });
            objchild.Add(new Clild { ParentId = 2, ChildId = 8, ChildName = "Bajaj Discover 125" });
            return objchild;
        }
    }
}
   
In above code I have created the list of parent and child item of the dropdown list item.  In post method I have retrieved the selected value of the dropdown. In this we are getting the id of the selected item in dropdown.

Now we will create view for the controller action result.

@model MvcApplication5.Models.DropdownModel
@{
    ViewBag.Title = "Display DropdownList Item By Group in Asp.Net MVC Using C#.Net";
}
@using (Html.BeginForm("Index", "Home"))
{
   
    <div>
        Trevel Mode:
        <select name="TeavelMode" id="ddltravelmode">
            <option value="0">Select</option>
            @foreach (var pitem in Model.ParentDataModel)
            {
                <optgroup label="@pitem.ParentName">
                    @{
                            var childitemfilter = Model.ClildDataModel.Where(m => m.ParentId == pitem.ParentId);
                            if (childitemfilter != null)
                            {
                                foreach (var citem in childitemfilter)
                                {
                                    string selectedValue = "";
                                    if (Model.SelectedValue == citem.ChildId)
                                    {
                                        selectedValue = "selected='selected'";
                                    }
                                  
                        <option value="@citem.ChildId" @selectedValue>@citem.ChildName</option>
                                }
                            }
                    }
                </optgroup>
            }
        </select>
        <input type="submit" value="Submit" />
    </div>
    <div>
    </div>
    <div style="font-weight:bold">@ViewBag.SelectedValue</div>
}

In above code in on the bases of the selected value and the child item value getting selected state. Now run the page for the output.


Select the item and click on submit button. In this you will not able to select car and bike which are parent in dropdown.


About the Author

We are the group of people who are expertise in different Microsoft technology like Asp.Net,MVC,C#.Net,VB.Net,Windows Application,WPF,jQuery,Javascript,HTML. This blog is designed to share the knowledge.

Get Updates

Subscribe to our e-mail newsletter to receive updates.

Share This Post

0 comments:

Please let me know your view

Free Ebooks


About Us

We are the group of people who are expertise in different Microsoft technology like Asp.Net,MVC,C#.Net,VB.Net,Windows Application,WPF,jQuery,Javascript,HTML. This blog is designed to share the knowledge.

Contact Us

For writing article in this website please send request by your

GMAIL ID: dotnetpools@gmail.com
Email Id : contact@aspdotnet-pools.com

Bugs and Suggestions

As we all know that this website is for sharing knowledge and providing proper solution. So while reading the article is you find any bug or if you have any suggestion please mail us at contact@aspdotnet-pools.com.

Partners


Top jQuery Plugins

Global Classified : Connectseekers.com
© 2014
back to top