To bind the DropDownList from more than one database tables in Entity Framework, use below approach.
@Html.DropDownList("MultipleTables", ViewBag.Roles as SelectList)
Controller action method code
var data = from p in db.PersonalDetails
join f in db.Files
on p.AutoId equals f.PersonalDetailsId
select new
{
PersonName = p.FirstName,
MyFileName = f.FileName
};
SelectList list = new SelectList(data, "MyFileName", "PersonName");
ViewBag.Roles = list;
In the above code snippet, we have
joined two tables using LINQ and formed an object having PersonName and MyFileName property. The same is being converted into SelectList by specifying
dataTextFileld
and
dataValueField
of the DropDownList.
The SelectList collection is then being set as ViewBag.Roles and the same is being used as data source of the DropDownList in the View page.
How to write Select ... text as first item in DropDownList in ASP.NET MVC?
To write default empty item as "Select ..." in the DropDownList, pass the third parameter as "Select ...".
@Html.DropDownList("MultipleTables", ViewBag.Roles as SelectList, "Select ...")
How to write style / class or other HTML attributes to the DropDownList in ASP.NET MVC?
To write style/class or other HTML attributes to the DropDownList, pass 4th parameter as htmlObjectAttributes.
@Html.DropDownList("MultipleTables", ViewBag.Roles as SelectList, "Select ...",
new { @class = "myClass", style = "width: 250px;" })
Output
<select class="myClass" id="MultipleTables" name="MultipleTables" style="width: 250px;"><option value="">Select ...</option>
<option value="Sheo File Name">Sheo</option>
<option value="Soumen File name">Soumen</option>
</select>
How to create a Model property that can be bounded to the DropDownList in ASP.NET MVC?
To create a Model property that can be bounded to the DropDownList, use below code snippet.
public IEnumerable<SelectListItem> Categories { get; set; }
Here we are creating Categories property that is of IEnumerable<SelectListItem> type.
Now in the Action method of the controller, set this property value like this
model.Categories = db.CategoryModels.Where(c => c.SectionId == sectionId &&
c.Active == true).OrderBy(ct => ct.CategoryName).ToList().
Select(x => new SelectListItem { Value = x.CategoryId.ToString(), Text = x.CategoryName }).ToList();
In the above code snippet, notice the third line of the code in which we are selecting all the items from the List and creating
SelectListItem
object by specifying Value as CategoryId and Text as CategoryName.
When this collection is bounded to the DropDownList, CategoryId is used as value of the item and CategoryName is used as Text of the DropDownList item.
How to auto post back the form on change of DropDownList item in ASP.NET MVC?
To auto post back the form on change of DropDownList item in ASP.NET MVC, we can specify onchange attribute in htmlObjectAttributes like this.
@Html.DropDownList("MultipleTables", ViewBag.Roles as SelectList, "Select ...",
new { @class = "myClass", style = "width: 250px;", onchange = "this.form.submit();" })
In the above code snippet, onchange attribute would force the form to submit it on the server when user is changing the selection in the DropDownList.
Conclusion
SelectList is basically the data source of the DropDownList in ASP.NET MVC and individual item of the DropDownList can be denoted by SelectListItem. By using these both objects we can manipulate the DropDownList in ASP.NET MVC.
Hope this article was useful. If you find any other problem related with DropDownList in ASP.NET MVC, let me know and I would try to solve and add in this article.
Thanks for reading and please refer this article to your friends and colleagues.