@Html.Checkbox select all

Question

So I have a table inside of my view and I have gotten to the point where my select-all checkbox is selecting/unselecting. However I can't seem to get it to select all the checkboxes. It only selects the first checkbox in the list.

Here is a snippet from my view.

<table class="table table-bordered">
<tr>
    <th>@Html.CheckBox("CheckAll", false, new { id = "select_all" })</th>

@for (int i = 0; i < Model.additionalCustomerInfoListView.Count; i++)
{
    <tr>                            
        <td>@Html.CheckBoxFor(model => model.additionalCustomerInfoListView[i].IsSelected, new { id = "someDivId" })</td>

and here is my jQuery

$('#select_all').click(function () {
    var c = this.checked;
    $('#someDivId').prop('checked', c)
});     

Appreciate any help I can get!

Answer 1

Change new { id = "someDivId" } to new { @class= "someClass"} .

Then Select all elements with "someClass" by using:

$('#select_all').click(function () {
    $('.someClass').prop('checked', this.checked)
});  

Answer 2

You should consider the other way also like when a child checkbox deselected then the parent should also be deselected.

Means if there are 10 checkboxes in table and if one is not selected then you should deselect the parent also.

Here is the code to select parent when you are selecting child checkboxes one by one

Via child

if($('#myTable tr').length-1 == $(".someClass:checked").length)
{
    //Select parent
}

Via Parent

$('#select_all').click(function () {
    $('.someClass').prop('checked', this.checked)
});  

Thanks