In this article I will explain with an example, how to populate (bind) CheckBoxList from database using Entity Framework in ASP.Net Core Razor Pages.
 
 
Database
I have made use of the following table Hobbies with the schema as follows.
ASP.Net Core Razor Pages: Populate (Bind) CheckBoxList from Database using Entity Framework
 
I have already inserted few records in the table.
ASP.Net Core Razor Pages: Populate (Bind) CheckBoxList from Database using Entity Framework
 
Note: You can download the database table SQL by clicking the download link below.
        Download SQL file
 
 
Model
The Model class consists of the following three properties.
The property HobbyId is decorated with the following Data Annotation attributes:
Key – It is used to apply the Primary Key constraint to the Column.
using System.ComponentModel.DataAnnotations;
 
public class HobbyModel
{
    [Key]
    public int HobbyId { get; set; }
    public string Hobby { get; set; }
    public bool IsSelected { get; set; }
}
 
 
Database Context
Once the Entity Framework is configured and connected to the database table, the Database Context will look as shown below.
Note: For beginners in ASP.Net Core and Entity Framework, please refer my article ASP.Net Core Razor Pages: Simple Entity Framework Tutorial with example. It covers all the information needed for connecting and configuring Entity Framework with ASP.Net Core.
 
using Microsoft.EntityFrameworkCore;
 
namespace CheckBoxList_EF_Razor_Core
{
    public class DBCtx : DbContext
    {
        public DBCtx(DbContextOptions<DBCtx> options) : base(options)
        {
        }
 
        public DbSet<HobbyModel> Hobbies { get; set; }
    }
}
 
 
Namespaces
You will need to import the following namespaces.
using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc.Rendering;
 
 
Razor PageModel (Code-Behind)
The PageModel consists of following two Handler methods.
Handler method for handling GET operation
Inside this Handler method, the PopulateHobbies method is called and assigned to the public property Hobbies.
Inside the PopulateHobbies method, the records from the Hobbies table are fetched usingand copied into generic list of SelectListItem class object.
Finally, the public property Hobbies is returned to the Razor Page.
 
Handler method for handling Button Click and POST operation
This Handler method handles the POST call when the Submit Button is clicked and the Form is submitted.
When the Form is submitted, the HobbyId of selected Hobby are captured in the Hobby parameter.
Finally, a loop is executed over the generic list of SelectListItem class objects and the selected Hobby names are set into a ViewData object which will be later displayed in View using JavaScript Alert Message Box.
public class IndexModel : PageModel
{
    private DBCtx Context { get; }
    public IndexModel(DBCtx _context)
    {
        this.Context = _context;
    }
 
    public List<SelectListItem> Hobbies { get; set; }
 
    public void OnGet()
    {
        this.Hobbies = this.PopulateHobbies();
    }
 
    public void OnPostSubmit(string[] hobby)
    {
        this.Hobbies = this.PopulateHobbies();
        string message = "Selected Items:\\n";
        foreach (SelectListItem item in this.Hobbies)
        {
            if (hobby.Contains(item.Value))
            {
                item.Selected = true;
                message += string.Format("{0}\\n", item.Text);
            }
        }
 
        ViewData["Message"] = message;
    }
 
    private List<SelectListItem> PopulateHobbies()
    {
        List<SelectListItem> hobbiesList = (from p in this.Context.Hobbies
                                            select new SelectListItem
                                            {
                                                Text = p.Hobby,
                                                Value = p.HobbyId.ToString()
                                            }).ToList();
 
        return hobbiesList;
    }
}
 
 
Razor Page (HTML)
Inside the Razor Page, the ASP.Net TagHelpers is inherited.
The HTML of Razor Page consists of an HTML Form with a Submit Button.
Inside the HTML Form, a loop is executed over the generic List of HobbyModel class objects and an HTML Table is generated consisting of a group of HTML Label elements and HTML CheckBoxes.
The Submit Button has been set with the POST Handler method using the asp-page-handler attribute.
Note: In the Razor PageModel, the Handler method name is OnPostSubmit but here it will be specified as Submit when calling from the Razor HTML Page.
 
When the Submit Button is clicked, the Form gets submitted and the values of the selected CheckBoxes are sent to the PageModel.
Finally, the selected Hobby names are displayed using JavaScript Alert Message Box.
@page
@addTagHelper*, Microsoft.AspNetCore.Mvc.TagHelpers
@model CheckBoxList_EF_Razor_Core.Pages.IndexModel
 
@{
    Layout = null;
}
 
<!DOCTYPE html>
 
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <form method="post">
        <table>
            @foreach (var hobby in Model.Hobbies)
            {
                <tr>
                    <td>
                        <input id="@hobby.Value" type="checkbox" name="Hobby" value="@hobby.Value" checked="@hobby.Selected" />
                    </td>
                    <td>
                        <label for="@hobby.Value">@hobby.Text</label>
                    </td>
                </tr>
            }
        </table>
        <br />
        <input type="submit" value="Submit" asp-page-handler="Submit" />
        @if (ViewData["Message"] != null)
        {
            <script type="text/javascript">
                 window.onload = function () {
                    alert("@ViewData["Message"]");
                };
            </script>
        }
    </form>
</body>
</html>
 
 
Screenshot
ASP.Net Core Razor Pages: Populate (Bind) CheckBoxList from Database using Entity Framework
 
 
Downloads
Download Code