articles

Home / DeveloperSection / Articles / Binding Checkbox in ASP.net MVC2

Binding Checkbox in ASP.net MVC2

Devesh Omar13645 19-May-2014
Introduction

I would like to share the way to bind the checkbox list in MVC. I will use Model (a

class file) to define various attribute for checkboxes.

For basic knowledge of MVC kindly follow link below

http://msdn.microsoft.com/en-us/library/dd381412(v=vs.100).aspx

Following are the Steps.

1)      Creating Model.

Binding Checkbox in ASP.net MVC2

We created a “SubjectModel” class under Models folder and defined two properties

a)      Subject : to Display text

b)      Selected : to display check/uncheck

2)      Creating controller

Binding Checkbox in ASP.net MVC2

a)      We created a Controller “BindingCheckBoxController” under controllers folder


b)      We created an Action having name = “DisplaycheckBoxes”


c)       We created a list of Subject (Subject model class)


d)        Returning List of subject to View.


  public ActionResult DisplayCheckboxes()
        {
            List<SubjectModel> listsubject = new List<SubjectModel>();
            listsubject.Add(new SubjectModel("Physics",true));
            listsubject.Add(new SubjectModel("Chemistry",true));
            listsubject.Add(new SubjectModel("History",false));
            listsubject.Add(new SubjectModel("Maths",false));
            listsubject.Add(new SubjectModel("Boilogy",false));
    listsubject.Add(new SubjectModel("Hindi",true));  
    ViewData[“Checkboxlist”]=listsubject;                                                                                                         
            return View();
         }

 

3)       Creating View .

Right click on Action and Click on create view. Following screen will display.

Binding Checkbox in ASP.net MVC2 


a)       Click on add button and View will be created. Here we are not creating strongly typed view. 

4)       Code at view.

Here we have view and we are trying to bind Checkbox using Model properties.

Binding Checkbox in ASP.net MVC2 

a)      At highlighted code we are parsing list of “SubjectModel” from ViewData["Checkboxlist"]). 

<% foreach (var info in (IEnumerable<MVCtest.Models.SubjectModel>)ViewData["Checkboxlist"])

We have passed Viewdata[“Checkboxlist”] from Controller. (From above, point 2.d)) 

b)      We have used foreach loop on list of subjects.

c)       We are using html helper class to bind Checkboxlist 

5)      Output

Binding Checkbox in ASP.net MVC2
6)      Binding checkboxes through strongly typed view 
Binding Checkbox in ASP.net MVC2

a)      We have created strongly typed view.
b)      We have selected “SubjectModel” class from view data class dropdown
c)       We have done small changes while passing object of list to view.


Following would be updated code for Action
public ActionResult DisplayCheckboxes ()
    {
           List<SubjectModel> listsubject = new List<SubjectModel>();
           listsubject.Add(new SubjectModel("Physics", true));
           listsubject.Add(new SubjectModel("Chemistry", true));
           listsubject.Add(new SubjectModel("History", false));
              listsubject.Add(new SubjectModel("Maths", false));
           listsubject.Add(new SubjectModel("Boilogy", false));
           listsubject.Add(new SubjectModel("Hindi", true));
           return View(listsubject);
  }

7)      Code at view.

For strongly typed view we have following code.

Binding Checkbox in ASP.net MVC2

The above line inherits “SubjectModel”, which implies that view is coupled with Model. 


Using foreach loop as per below we can display list of checkbox at DOM.

Binding Checkbox in ASP.net MVC2 


8)      Output

We will get same output as per point 5

Conclusion

In this article we have learned how to bind checkbox list using MVC2. We have

learned two ways to bind checkboxes using strongly typed view and without using

strongly typed view.

References

I had posted another article for binding Dropdown list using MVC2

http://www.c-sharpcorner.com/UploadFile/deveshomar/ways-to-bind-dropdown-list-in-Asp-Net-mvc/ 


Happy Coding!!!!!!!

 


Updated 07-Sep-2019
I am Software Professional

Leave Comment

Comments

Liked By