MVC List of Checkboxes bound to model

Question

I have some issue with binding a collection to a model. I followed this link to create a list of checkbox. I am not sure of how much code to provide, but my view has the following models

Public class Model1{
     public string param1{get; set;}
     public string param2{get; set;}
}

Public class Model2{
     public string param1{get; set;}
     public string param2{get; set;}
}

Public class Model3: Model2{
     public bool chk {get; set;}
     public list<string> param{get; set;}
     public Model3()
     {
        param = new List<string>(){"one", "two", "three"};
     }
}



public class superModel{
        public Model1 first{get; set;}
        public IEnumerable<Model2> second{get; set;}
        public List<Model3> third{get; set;}
   }

In my controller, I have defined the parametr third as

third = AnEnumerableList.Select( e=> new Model3{chk=false, param1 = e.Param, param2 = e.Param1}).ToList();

and in my view, I pass the supermodel holding all my class model. I create a checkbox like this:

for(int i=0; i<Model.third.Count; i++){
    @Html.CheckBoxFor(m => m.third[i].chk, new {onchange="test()"})
    @Html.HiddenFor(m => m.third[i].param)
    @Html.HiddenFor(m => m.third[i].param1)
    @Html.HiddenFor(m => m.third[i].param2)

}

The javascript look like

function test(){
   alert('@Model.third[0].chk')
}

When I look at the generated source code, everything looks fine, but the javascript code always returns false regardless of if the checkbox is checked or not. And when the view form is submitted, the whole view does not show. Instead, I get like a partial view with the name of the first selected checkbox. When nothing was selected in this collection, the returning view is submitted alright. I tried to debug the code, but nothing breaks during the process.

I know, this I may not have issolated this problem enough, but this is as much as I can...

Mathew Thompson · Accepted Answer · 2013-03-18 12:13:55Z

1

That's because you're looking at the Model value and not the current value of the checkbox. You'd need to change it, firstly, change your checkbox declaration to pass this, like so:

@Html.CheckBoxFor(m => m.third[i].chk, new {onchange="test(this)"})

Then change your test function slightly, to be:

function test(item){
    alert(item.checked)
}

answered Mar 18, 2013 at 12:13

Mathew Thompson

56.5k15 gold badges131 silver badges151 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

jpo Over a year ago

Thank you. You are right. That works better. But I am still facing an issue. For some reason, whenever a checkbox is selected and I submit the form, a get a blank view with the name of the first selected checkbox. Everything works fine when no checkbox is selected. This may be too broad but do you have any idea on what can cause this?

Mathew Thompson Over a year ago

@jpo No problems! Hmmm that sounds like a problem with what your post action method is returning. Can you post your HttpPost action?

jpo Over a year ago

Thank you so much. Some weird things seem to be happenng at that level. I simplified the code and it work. I will go from here to figure out the issue. THANK YOU!

Collectives™ on Stack Overflow

MVC List of Checkboxes bound to model

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related