How to Use DropDownList Helper in MVC Application

Introduction

This article shows how to use the dropdownlist helper in MVC applications.

  • Index: wrapping data coming from Entity Framework (EF).
  • Index1: wrapping data coming from the Controller's Action Result.
  • Index2: wrapping data inside the view.

Create an ASP.Net MVC 4 Web Application


Figure 1 Web Application

Choose Internet Application


Figure 2 Internet Application

Add an EmployeeController


Figure 3 Add EmployeeController

Set up an Entity Framework


Figure 4 Entity Framework 


Figure 5 Data Connection 
 
 
Figure 6 Data Connection Object

Employeecontroller.cs

  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.Web.Mvc;  
  6. using DropDownListApp_MVC.Models;  
  7.   
  8. namespace DropDownListApp_MVC.Controllers  
  9. {  
  10.     public class EmployeeController : Controller  
  11.     {  
  12.         //  
  13.         // GET: /Employee/  
  14.         EmployeeEntities objEmployeeEntities = new EmployeeEntities();  
  15.         public ActionResult Index()  
  16.         {  
  17.             ViewBag.List = new SelectList(objEmployeeEntities.Departments.Select(r => r.DepartmentName));  
  18.             return View();  
  19.         }  
  20.   
  21.         public ActionResult Index1()  
  22.         {  
  23.             List<SelectListItem> items = new List<SelectListItem>();  
  24.             items.Add(new SelectListItem { Text = "IT", Value = "0" });  
  25.             items.Add(new SelectListItem { Text = "HR", Value = "1" });  
  26.             items.Add(new SelectListItem { Text = "Management", Value = "2" });  
  27.             ViewBag.List = items;  
  28.           
  29.             return View();  
  30.         }  
  31.   
  32.         public ActionResult Index2()  
  33.         {  
  34.                 return View();  
  35.         }  
  36.   
  37.           
  38.   
  39.     }  
  40. }

Adding View


Figure 7 Add View

Index.cshtml

  1. @{  
  2.     ViewBag.Title = "Index";  
  3. }  
  4.   
  5. <h2>Index</h2>  
  6.   
  7. @Html.DropDownList("List", "------Select List------")

Index1.cshtml

  1. @{  
  2.     ViewBag.Title = "Index1";  
  3. }  
  4.   
  5. <h2>Index1</h2>  
  6.   
  7. @Html.DropDownList("List", "------Select List------")

Index2.cshtml

  1. @{  
  2.     ViewBag.Title = "Index2";  
  3. }  
  4.   
  5. <h2>Index2</h2>  
  6.   
  7. @Html.DropDownList("List", new List<SelectListItem>  
  8. {  
  9.     new SelectListItem{ Text="IT"Value="1"},  
  10.     new SelectListItem{ Text="HR"Value="2"},  
  11.     new SelectListItem{ Text="Management"Value="3"}  
  12. }, "----Select List----")

The output of the application as in the following screenshot.


Figure 8 Output 1 
 

Figure 9 Output 2
 
 
Figure 10 Output3

Summary

In this article we saw how to use a dropdownlist helper in MVC applications.

Happy coding.