Introduction:

In this article we will learn how to bind DropDownList from database in asp.net core razor page with Entity framework core 2.0.

Description:

Now here we are going to bind DropDownList from database in ASP.NET Core, using Entity Framework Core 2.0 with example.  

Now let’s create a demo to bind DropDownList from database in asp.net core.

Create table following below script:

CREATE TABLE country
(
  ID BIGINT IDENTITY(1,1) PRIMARY KEY,
  Name VARCHAR(150)
)

 

Insert data in table following below script:

USE [collage]
GO
SET IDENTITY_INSERT [dbo].[country] ON
 
INSERT [dbo].[country] ([ID], [Name]) VALUES (1, N'India')
INSERT [dbo].[country] ([ID], [Name]) VALUES (2, N'Afghanistan')
INSERT [dbo].[country] ([ID], [Name]) VALUES (3, N'Australia')
INSERT [dbo].[country] ([ID], [Name]) VALUES (4, N'Germany')
INSERT [dbo].[country] ([ID], [Name]) VALUES (5, N'Iran')
INSERT [dbo].[country] ([ID], [Name]) VALUES (6, N'Iraq')
INSERT [dbo].[country] ([ID], [Name]) VALUES (7, N'Japan')
INSERT [dbo].[country] ([ID], [Name]) VALUES (8, N'Lesotho')
INSERT [dbo].[country] ([ID], [Name]) VALUES (9, N'Lithuania')
INSERT [dbo].[country] ([ID], [Name]) VALUES (10, N'Spain')
SET IDENTITY_INSERT [dbo].[country] OFF

 

 Now write following code in Student.cshtml

@page
@model StudentModel
@{
   ViewData["Title"] = "Student";
   Layout = "~/Pages/_Layout.cshtml";
}
 
 <div class="container">
   <h3>Add Student</h3>
   <hr /> 
   <form method="post">
       <input asp-for="Student.Id" type="hidden" />
       <div class="row">
            <div class="col-md-4">
                <label asp-for="Student.Name"></label>
                <input asp-for="Student.Name" class="form-control" />
            </div>
       </div>
       <div class="row">
            <div class="col-md-4">
                <label asp-for="Student.Address"></label>
                <input asp-for="Student.Address" class="form-control" />
            </div>
       </div>
       <div class="row">
            <div class="col-md-4">
                <label asp-for="Student.Country"></label>
                <select asp-for="Student.Country" class="form-control"
  asp-items="@(new SelectList(Model.Countries,"Id", "Name"))"></select>
            </div>
       </div>
 
       <div class="row">
       <div class="col-md-4">
                <label asp-for="Student.City"></label>
                <input asp-for="Student.City" cl class="form-control" />
            </div>
       </div>
 
       <div class="row">
            <div class="col-md-4">                <label asp-for="Student.Phone"></label>
                <input asp-for="Student.Phone" class="form-control" />
            </div>
       </div>
       <br />
       <input type="submit" value="Save" class="btn btn-primary" />
       <a class="btnbtn-default" href="/StudentList">Cancel</a>
   </form>
</div> 
 
@section Scripts {
   @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}
 

 

 

 Now write the following code in Student.cshtml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using AspDotNetCoreApp.Models.DataBase;
 
namespace AspDotNetCoreApp.Pages
{
   public class StudentModel : PageModel
   {
       [BindProperty]
       public Student Student { get; set; }
       public List<Country>Countries { get; set; }
 
       collageContext _context = new collageContext();
       public void OnGet()
       {
            Countries =_context.Country.ToList();
       }
 
       public ActionResult OnPost()
       {
            var student = Student;
            _context.Student.Add(student);
            _context.SaveChanges();
            return RedirectToPage("StudentList");
       }
   }
}

 

 

Now build and run the application using CTRL + 5. It should bring up the following page.



 how to bind dropdownlist in Asp.Net core from database using entity framework

Figure 1: ASP.NET Core DropDownList

 

Now fill all fields name, address and country then click to register button your data submitted to server as shown in the following figure below:

how to bind dropdownlist in Asp.Net core from database using entity framework 


I hope it will help to you.

comments


Leave a comment

Make sure you enter the (*) required information where indicated. HTML code is not allowed.

You may also like