Tuesday 1 September 2020

Bind DropdownList in ASP.Net Core

 Models

public enum SeasonEnum
{
    Spring,
    Summer,
    Autumn,
    Winter 
 }

public class SeasonModel
{
    public int Id { get; set; }
    public string Name { get; set; }

}

public class DropdownModel
{
    public List<SeasonModel> Season { get; set; }
}

Controllers


public IActionResult Index()
{
    ViewBag.Season = new List<SelectListItem>()
    {
        new SelectListItem(){ Text="Spring", Value="Spring" },
        new SelectListItem(){ Text="Summer", Value="Summer"},
        new SelectListItem(){ Text="Autumn", Value="Autumn"},
        new SelectListItem(){ Text="Winter", Value="Winter"},
    };
 
    DropdownModel dropdownModel = new DropdownModel();
    dropdownModel.Season = new List<SeasonModel>() {
        new SeasonModel(){ Id=1, Name = "Spring"},
        new SeasonModel(){ Id=2, Name = "Summer"},
        new SeasonModel(){ Id=3, Name = "Autumn"},
        new SeasonModel(){ Id=4, Name = "Winter"},
    };
 
    return View(dropdownModel);
}

View


@model DropdownModel
 
@{
    ViewData["Title"] = "Home Page";
}
 
<div class="text-center">
    <h1 class="display-4">Welcome</h1>
    <p>Learn about <a href="https://docs.microsoft.com/aspnet/core">building Web apps with ASP.NET Core</a>.</p>
</div>
<h3>Hardcode Values</h3>
 
<select id="Season" class="form-control">
    <option value="">Select State</option>
    <option value="Spring">Spring</option>
    <option value="Summer">Summer</option>
    <option value="Autumn">Autumn</option>
    <option value="Winter">Winter</option>
</select>
 
<h3>Tag Helpter + ViewBag</h3>
 
<select id="Season" asp-items="@ViewBag.Season" class="form-control">
    <option value="">Select State</option>
</select>
 
<h3>Tag Helpter + Enum</h3>
 
<select id="Season" asp-items="@Html.GetEnumSelectList<SeasonEnum>()" class="form-control">
    <option value="">Select Season</option>
</select>
 
<h3>Tag Helpter + Model</h3>
 
<select id="Season" asp-items="@(new SelectList(Model.Season,"Id", "Name"))" class="form-control">
    <option value="">Select Season</option>
</select>
 
<h3>Razor + ViewBag</h3>
 
@Html.DropDownList("Season", (IEnumerable<SelectListItem>)@ViewBag.Season, "Select Season", new { @class = "form-control" })
 
<h3>Razor + Enum</h3>
 
@Html.DropDownList("Season", @Html.GetEnumSelectList<SeasonEnum>(), "Select Season", new { @class = "form-control" })
 
<h3>Razor + Model</h3>
 
@Html.DropDownListFor(model => model.Season, new SelectList(Model.Season, "Id", "Name"), "Select Season", new { @class = "form-control" })
 
<h3>Razor + Hardcode Values</h3>
 
@Html.DropDownList("Season", new List<SelectListItem>
     {
        new SelectListItem { Text = "Spring", Value = "Spring",},
        new SelectListItem { Text = "Summer", Value = "Summer"},
        new SelectListItem { Text = "Autumn", Value = "Autumn"},
        new SelectListItem { Text = "Winter", Value = "Winter"}

     }, "Select Season", new { @class = "form-control" })

 

Output




No comments:

Post a Comment