In this article I will explain with an example, how to create DropDownList from Enum in ASP.Net MVC.
Enum
Following Enum named Colors consists of 3 Items i.e. Red, Green and Blue to which the values are set to 1, 2 and 3 respectively.
public enum Colors
{
Red = 1,
Blue = 2,
Green = 3
}
Controller
The Controller consists of following two Action methods.
Action method for handling GET operation
Inside this Action method, the GetColors method is called.
Inside the GetColors method, the values of the Enum are fetched and then a loop is executed over the Array items and one by one each item is added into Generic list of SelectListItem class.
Note: The SelectListItem class which is an in-built ASP.Net MVC class. It has all the properties needed for populating a DropDownList.
A Blank item is inserted at first position (0th index) in the Generic list of SelectListItem class and it will be used to show the Default item in DropDownList.
Finally, Generic list of SelectListItem is returned to the View.
Action method for handling POST operation
This Action method gets called when Submit button is clicked.
Inside this Action method, the posted value is captured through the color parameter which is also set as the Name attribute of the DropDownList.
Then, the selected color name is fetched using GetName method of Enum.
Finally, the Name and Value are set into a
ViewBag object which will be later displayed in View using JavaScript Alert Message Box.
public class HomeController : Controller
{
// GET: Home
public ActionResult Index()
{
return View(this.GetColors());
}
[HttpPost]
public ActionResult Index(int color)
{
if (color > 0)
{
string colorName = Enum.GetName(typeof(Colors), color);
ViewBag.Message = "Color: " + colorName;
ViewBag.Message += "\\nID: " + color;
}
return View(this.GetColors());
}
private List<SelectListItem> GetColors()
{
List<SelectListItem> colors = new List<SelectListItem>();
foreach (Colors color in Enum.GetValues(typeof(Colors)))
{
colors.Add(new SelectListItem { Text = color.ToString(), Value = ((int)color).ToString() });
}
//Add Default Item at First Position.
colors.Insert(0, new SelectListItem { Text = "--Select Color--", Value = "0" });
return colors;
}
}
View
Inside the View, in the very first line Generic list of SelectListItem class is declared as Model for the View.
The View consists of an HTML Form which has been created using the Html.BeginForm method with the following parameters.
ActionName – Name of the Action. In this case the name is Index.
ControllerName – Name of the Controller. In this case the name is Home.
FormMethod – It specifies the Form Method i.e. GET or POST. In this case it will be set to POST.
The Form consists of a DropDownList field created using Html.DropDownList of Html Helper method and a Submit Button.
The first parameter is the Id of the Html.DropDownList, the second parameter is the Model class for populating the DropDownList i.e. its source of data and the third parameter is the htmlAtttributes in which the Name attribute is set and the same will also be used to fetch the selected value inside Controller when the Form is submitted.
Form Submit
When the
Submit Button is clicked, the Form gets submitted and the
ViewBag object is checked for NULL and if it is not NULL then, the value of the
ViewBag object is displayed using JavaScript Alert Message Box.
@model List<SelectListItem>
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
@using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
@Html.DropDownList("ddlColors", Model, new { Name = "color" })
<input type="submit" value="Submit" />
}
@if (ViewBag.Message != null)
{
<script type="text/javascript">
window.onload = function () {
alert("@ViewBag.Message");
};
</script>
}
</body>
</html>
Screenshot
![Create DropDownList from Enum in ASP.Net MVC]()
Demo
Downloads
