Index

--- title: "DropDownList control in MVC" description: "In this article, I am explaining how to add items in DropDownList and how to get selected item from DropDownList in ASP.NET MVC. Create a property in" author: "Chris Anderson" published: 2011-10-04 updated: 2020-03-04 canonical: https://www.mindstick.com/articles/760/dropdownlist-control-in-mvc category: "asp.net mvc" tags: ["asp.net mvc"] reading_time: 4 minutes --- # DropDownList control in MVC In this article, I am explaining how to [add items](https://www.mindstick.com/forum/160381/how-to-add-items-to-a-list-collection-in-c-sharp) in [DropDownList](https://www.mindstick.com/blog/33/dropdownlist-in-asp-dot-net) and how to get selected item from DropDownList in [ASP.NET MVC](https://www.mindstick.com/articles/1571/start-with-asp-dot-net-mvc-4).\ Create a [property](https://www.mindstick.com/articles/198559/an-ownership-of-property-in-hua-hin) in a [model class](https://www.mindstick.com/forum/2281/filter-objects-inside-model-class-by-date) that returns a product list to a caller. In the above model class I had created a property named Product that return list of product. ``` using System.Collections.Generic; using System.ComponentModel.DataAnnotations; using System.Web.WebPages.Html; namespace DropDownMVC.Models { public class Article { private List _products = new List(); [Required(ErrorMessage = "Please select a product")] public string SelectedProduct { get; set; } public List Products { get { _products.Add(new SelectListItem() {Text = "KeyBoard", Value = "KeyBoard" }); _products.Add(new SelectListItem() {Text="Monitor",Value = "Monitor" }); return _products; } } } } ``` In a [Controller](https://www.mindstick.com/blog/273/passing-values-from-controller-to-view-in-asp-dot-net-mvc) class, Index action returns a model class objects to view. Like in the above Controller I passed the model class object to both the Index and GetValue View; ``` using System.Collections.Generic; using System.Web.Mvc; using DropDownMVC.Models; namespace DropDownMVC.Controllers { public class HomeController : Controller { public ActionResult Index() { return View(new Article()); } public ActionResult GetValue(Article model){ return View(model); } } } ``` In below Index view I have created a DropDownList and use a Model property to fill the items in DropDownList. I also show that how to call java script method through onchange event of DropDownList (onchange="selectedIndexChanged()").When you click on [submit button](https://www.mindstick.com/forum/130/its-possible-without-submit-button) it will call another view (GetValue) and show the [selected value](https://www.mindstick.com/forum/525/get-selected-value-of-datagridviewcomboboxcolumn) of DropDownList.\ ``` <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %> Index <% using (Html.BeginForm("GetValue","Home",FormMethod.Post)) {%>

Select a product: <%:Html.DropDownListFor(x => x.SelectedProduct, new SelectList(Model.Products, "Value", "Text"), "Please Select a product", new { id = "dropDown1", onchange="selectedIndexChanged()" })%> <%: Html.ValidationMessageFor(x => x.SelectedProduct) %>

<% } %> ``` \ In the GetValue View, I had used Model property to show the selected DropDownList value. ``` <%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage" %> GetValue

The selected product is: <%: ViewData.Model.SelectedProduct %>

``` After completing the above process you can see an output of [your project](https://www.mindstick.com/forum/156583/best-way-to-link-bootstrap-file-in-your-project) by pressing F5. In the browser it will show you the list of product in a DropDownList. ![DropDownList control in MVC](https://www.mindstick.com/mindstickarticle/ada809ae-b140-4f58-83e7-914b1c5ff556/images/81e78b29-1be8-4a26-9dd0-54c2ffae78db.png) When you select a product and click on submit button, it will show the selected product in the GetValue view. ![DropDownList control in MVC](https://www.mindstick.com/mindstickarticle/ada809ae-b140-4f58-83e7-914b1c5ff556/images/9957401c-9804-411b-8991-0ef46bf778ec.png) By using above process you can simply learn that how to add items in the DropDownList and get a selected value from the DropDownList in MVC. --- Original Source: https://www.mindstick.com/articles/760/dropdownlist-control-in-mvc Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.