This article will show you how to create check box list in ASP.NET MVC. Consider that we have a list consist of three properly Name, ID and IsSelected and we have to show a checkboxlist using this list. First create a model with these properties, consider a category model with three properties and a static method which will return list of model as below.
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
namespace Sample.Models
{
public class Category
{
public int ID { get; set; }
public string Name { get; set; }
public bool IsSelected{ get; set; }
public static List<Category> getCategory()
{
List<Category> category = new List<Category>()
{
new Category() { ID =1, Name="Cat1", IsSelected = true },
new Category() { ID =2, Name="Cat2", IsSelected = false },
new Category() { ID =3, Name="Cat3", IsSelected = true },
new Category() { ID =4, Name="Cat4", IsSelected = false },
new Category() { ID =5, Name="Cat5", IsSelected = true },
new Category() { ID =6, Name="Cat6", IsSelected = false },
new Category() { ID =7, Name="Cat7", IsSelected = true },
new Category() { ID =8, Name="Cat8", IsSelected = false },
};
return category;
}
}
Add a controller where a method will return a list of model to view. We have ProductCategoryController and index method which return list of model to view as below.
namespace Sample.Controllers
{
public class ProductCategoryController : Controller
{
public ActionResult Index()
{
List<Category> model = new List<Category>();
model = Category.getCategory();
return View(model);
}
}
Add view to this controller method. In view we have model as list of category. Now to create check box list iterate through each item of model and create checkbox list as below.
@model List<Sample.Models.Category>
@{
ViewBag.Title = "Index";
Layout = "~/Views/Shared/_Layout.cshtml";
}
<h2>Category</h2>
@using (Html.BeginForm("Index", "ProductCategory", FormMethod.Post))
{
for (int i = 0; i < Model.Count; i++)
{
@Html.CheckBoxFor(m => m[i].IsSelected)
@Html.Label(Model[i].Name);
@Html.HiddenFor(m => m[i].Name)
@Html.HiddenFor(m => m[i].ID)
<br />
}
<div> <input type="submit" value="Go!" /></div>
Now, it is very Interesting thing, when you create @Html.CheckBox it will create automatically a hiddenfield for this checkbox, which will use to maintain checkbox status checked or unchecked, when this list get post to model and to get complete list at controller in post method, you have to add two more hidden field for name and ID (two other properties of list) as above.
Here is post method:
[HttpPost]
public ActionResult Index(List<Category> model)
{
// do operation on list
return RedirectToAction("Index");