Asp.Net MVC DropDownList Data Binding

Question

                    <form id="Form1" runat="server">
                        <asp:DropDownList ID="dvmDrmList" runat="server">
                            <asp:ListItem>Theory</asp:ListItem>
                            <asp:ListItem>Appliance</asp:ListItem>
                            <asp:ListItem>Lab</asp:ListItem>
                        </asp:DropDownList>
                    </form>

I want to bind this DropDownList in controller. I mean how can I get the value of the dropDownList in the action method in controller class. Thanks.

Michał Powaga · Accepted Answer · 2013-11-29 10:01:57Z

9

I see that you are using forms with runat="server" and asp:XXX web controls. Those are notions should never be used in ASP.NET MVC. There is no more ViewState and PostBacks that those server controls rely on.

So in ASP.NET MVC you would start by defining a view model representing the data:

public class ItemsViewModel
{
    public string SelectedItemId { get; set; }
    public IEnumerable<SelectListItem> Items { get; set; }
}

then you would define a controller with two actions (one that renders the view and another that handles the form submission):

public class HomeController : Controller
{
    public ActionResult Index()
    {
        var model = new ItemsViewModel
        {
            Items = new[]
            {
                new SelectListItem { Value = "Theory", Text = "Theory" },
                new SelectListItem { Value = "Appliance", Text = "Appliance" },
                new SelectListItem { Value = "Lab", Text = "Lab" }
            }
        };
        return View(model);
    }

    [HttpPost]
    public ActionResult Index(ItemsViewModel model)
    {
        // this action will be invoked when the form is submitted and 
        // model.SelectedItemId will contain the selected value
        ...
    }
}

and finally you would write the corresponding strongly typed Index view:

<%@ Page 
    Language="C#" 
    MasterPageFile="~/Views/Shared/Site.Master" 
    Inherits="System.Web.Mvc.ViewPage<AppName.Models.ItemsViewModel>" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Home Page
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <% using (Html.BeginForm()) { %>
        <%= Html.DropDownListFor(x => x.SelectedItemId, new SelectList(Model.Items, "Value", "Text")) %>
        <input type="submit" value="OK" />
    <% } %>
</asp:Content>

This being said you could also hardcode this select inside your view (although this is something I wouldn't recommend):

<% using (Html.BeginForm()) { %>
    <select name="selectedItem">
        <option value="Theory">Theory</option>
        <option value="Appliance">Appliance</option>
        <option value="Lab">Lab</option>
    </select>
    <input type="submit" value="OK" />
<% } %>

and have the following controller:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult Index(string selectedItem)
    {
        // this action will be invoked when the form is submitted and 
        // selectedItem will contain the selected value
        ...
    }
}

edited Nov 29, 2013 at 10:01

Michał Powaga

23.4k8 gold badges54 silver badges62 bronze badges

answered Jan 21, 2011 at 18:25

Darin Dimitrov

1.0m275 gold badges3.3k silver badges3k bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Pushpendra Kuntal Over a year ago

How can i use this code var model = new ItemsViewModel { Items = new[] { new SelectListItem { Value = "Theory", Text = "Theory" }, new SelectListItem { Value = "Appliance", Text = "Appliance" }, new SelectListItem { Value = "Lab", Text = "Lab" } } }; if i want to get values of drop downlist from database. please suggest me what should i do if i am taking values from database then what code will i use ?

Darin Dimitrov Over a year ago

@Pushpendra Kuntal, that will depend on what database you are using, how does your database table schema looks like and what database access technology you are using.

Collectives™ on Stack Overflow

Asp.Net MVC DropDownList Data Binding

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related