Bind Dropdown List from Database in Asp.Net Core MVC Using C#.Net

In today's article I will show a simple tutorial with example that how you can bind dropdown list or populate the value in dropdown list from MS SQL database using entity framework in asp.net core mvc 8 using c#.net. Here we will user model class to populate or bind the dropdown list with DropdownListFor. Now let's create a table in Ms SQL and add some data in it.

Now let's create a new asp.net core mvc 8 mvc application and add a model class file and below code.

public class EmployeeModel
{
    public int EmployeeId { get; set; } 
    public List<EmployeeDetail> Employees { get; set; }
}
public class EmployeeDetail
{
    public int Id { get; set; }
    public string Employee_Name { get; set; }
} 

In above code I have declared class one for the property for employee and the in second class I have taken the property for employee id and a collection of list of employee. Now let's add a controller class file add a httpget method. 

 [HttpGet]
public IActionResult Index()
{
    EmployeeModel employeeModel = new EmployeeModel();
    employeeModel.Employees = new List<EmployeeDetail>();
    EmployeeContext employeeContext = new EmployeeContext();
    var data = employeeContext.Employees.ToList();
    employeeModel.Employees.Add(new EmployeeDetail
	  {
   	 	Id = 0,
    	Employee_Name = "Select Employee"
	  });
    foreach (var item in data)
    {
        employeeModel.Employees.Add(new EmployeeDetail
        {
            Id = item.Id,
            Employee_Name = item.EmployeeName
        });
    }
    return View(employeeModel);
} 

In above code I have created object of EmployeeModel class file and after that I have created object of employee list. In next line I have created object of DBcontext, after that I have accessed the value of employee table. I have added a default value in the list. This will be the default value. After this is have used foreach loop to add the value in the collection.  At the end passed the object of model class to view. Now let's create the view and add the below code in it.

@model EmployeeModel
@{
	ViewData["Title"] = "Home Page";
}
@using (Html.BeginForm("Index", "Home", FormMethod.Post))
{
	<span>Select Employee:</span>
	@Html.DropDownListFor(m => m.EmployeeId, new SelectList(Model.Employees, "Id", "Employee_Name"), new { @class = "form-select" })
	<br />
	<input type="submit" value="Submit" />
} 

Here in above code, I have added the reference of model class file. This is to bind the property to the controls. After this I have defined the form control, this help us to get the value at controller end. after this is have used DropDownListFor control for dropdown. Now at the end the submit button the post the form to get invoke the post event. Here is the code for httppost method.

[HttpPost]
public IActionResult Index(EmployeeModel employeeModel)
{
    employeeModel.Employees = new List<EmployeeDetail>();
    EmployeeContext employeeContext = new EmployeeContext();
    var data = employeeContext.Employees.ToList();
    employeeModel.Employees.Add(new EmployeeDetail
    {
        Id = 0,
        Employee_Name = "Select Employee"
    });
    foreach (var item in data)
    {
        employeeModel.Employees.Add(new EmployeeDetail
        {
            Id = item.Id,
            Employee_Name = item.EmployeeName
        });
    }
    return View(employeeModel);
} 

In above code I have passed the model class a parameter in the HttpPost method. This will help us to get the selected value at controller end when user select and click on submit button. Here I have again fetched the value from the database and added to the collection. Now let's run the code to check the output.

Now let's select a value and click on submit button by putting a break point.

Let's check what we get ones the break point execute.

Now press F5 to check to complete the execution. Here dropdown will retain the selected value because we have passed the selected value and the collection.