How to use CheckboxList In MVC3 View And Get The Checked Items Passed To The Controller with example

In this article i will show you how you can create a checkboxlist in mvc3 and how you can get it`s selected value in controller.

So here we go. first you needed to create a new asp.net mvc3 application. in this add a new controller and model file.
Now create view for the index method of the controller. Now come o your model and add the below code in your model file.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace MVC_checkboclist.Models
{
    public class ItemViewModel
    {
        public List<ItemView> ItemViewDataModel { get; set; }
    }
    public class ItemView
    {
        public string Id { get; set; }
        public string CountryName { get; set; }
        public bool Checked { get; set; }
    }
}

Now again come to your controller and add the below code in the controller file.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using MVC_checkboclist.Models;

namespace MVC_checkboclist.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Hom/

        public ActionResult Index()
        {
            ItemViewModel objitemviewmodel = new ItemViewModel();
            objitemviewmodel.ItemViewDataModel = new List<ItemView>();
            objitemviewmodel.ItemViewDataModel.Add(new ItemView { Id = "1", Checked = true, CountryName = "India" });
            objitemviewmodel.ItemViewDataModel.Add(new ItemView { Id = "2", Checked = false, CountryName = "Pakistan" });
            objitemviewmodel.ItemViewDataModel.Add(new ItemView { Id = "3", Checked = true, CountryName = "Nepal" });
            return View(objitemviewmodel);
        }
        [HttpPost]
        public ActionResult Index(ItemViewModel objitemviewmodel)
        {
          
            string message = "You have selected :";
            foreach (var data in objitemviewmodel.ItemViewDataModel)
            {
                if (data.Checked == true)
                {
                    message += data.CountryName + ",";
                }
            }
            ViewBag.SelectedData = message;
            return View(objitemviewmodel);
        }
    }
}

In above code first i have created httpget method for index. In htis i have created a list of country. In httppost method i have stored the  recived collection value in viewbag.

Now come to view and add the below code. 

@model MVC_checkboclist.Models.ItemViewModel
@using (Html.BeginForm("Index", "Home"))
{
    <h3>
        Getting Checkbox value in controller</h3>
    for (var i = 0; i < Model.ItemViewDataModel.Count; i++)
    {
        @Html.HiddenFor(m => m.ItemViewDataModel[i].Id)
        @Html.HiddenFor(m => m.ItemViewDataModel[i].CountryName)           
        @Html.CheckBoxFor(m => m.ItemViewDataModel[i].Checked)
        @Html.DisplayFor(m => m.ItemViewDataModel[i].CountryName)
    <br />
    }
    <input type="submit" value="Submit" />
    <div><b>@ViewBag.SelectedData</b></div>   
}

Here we are creating the check box list.

now put a break point on the httppost method of the index method of controller and run the application. In out put you will see the item whose checked value was true were in checked condition.



Now click on submit button your break point will hit and you will get the collection in controller.



Now store the information in view bag. Here is the final output.