DropDownList Helper Data Binding in MVC

In this article, you will learn how to bind data to a DropDownList helper in MVC. We will try binding data to a DropDownList from a List<SelectListItem>, a List<Model> and also from a database.

I've created three DDL helpers on the view page and to bind each DDL we will use a different approach.

Let's bind each DDL using various approaches.

1st Approach

In this approach, I am going to bind a Country DDL with List<SelectListItem> data; here is the code I'm using in the action method.

Notice two things in above code

First: I have created a List<SelectListItem> that is IEnumerable<SelectListItem> and adding 3 items to the country object. The IEnumerable<SelectListItem> created above is added to the ViewBag with the name Country. This is how we pass the IEnumerable<SelectListItem> implicitly to the DDL helper shown below.

@Html.DropDownList("Country", String.Empty)

In the above code, the helper accepts two parameters. The first parameter named DDL ("Country") is a compulsory parameter and it should be similar to the ViewBag (ViewBag.Country) name and the second, optionLabel, is not compulsory. The optionLabel is generally used the for first option in DDL. For example, if I use:

@Html.DropDownList("Country", "Select Country")

Then, it will render the following output.

Second: We can pass the IEnumerable<SelectListItem> explicitly to the DropDownList helper or we can add the IEnumerable<SelectListItem> to the ViewBag using the same name for the SelectListItem as the model property, look at the code how four different overloads are arranged.