checkbox check all option

Question

I have checkbox set with Category Subcategorywise...

Company
    Microsoft
    Apple

 Country
     USA
     UK

and checkbox attached to e

Answer 1

See simple demo here: http://jsfiddle.net/Pfmuq/2/ or simpler: http://jsfiddle.net/Pfmuq/3/

Please note id should always be unique at all times, rest when you will read the code I have noticed a pattern in your parent and Sub naming hence I took that under account.

please note I also took liberty to switch over your id and class anyhoo code is below :)

Rest hope this helps, :)

code

$('input[name="Company"],input[name="Country"]').click(function(){
    if ($(this).is(':checked')){
          $(this).nextAll('input[name="'+this.name+'Sub"]').prop('checked',true);

    } else {
          $(this).nextAll('input[name="'+this.name+'Sub"]').prop('checked',false);   
    }
});
​

code from 2nd demo

$('input[name="Company"],input[name="Country"]').click(function(){
          $(this).nextAll('input[name="'+this.name+'Sub"]').prop('checked',this.checked);
});
​

HTML

<input type="checkbox" class="entityCheckboxHeader1" id="entityCheckboxHeader" name="Company">Company
 <input class="modalEntityCompany" id="entity1" type="checkbox" name="CompanySub">Microsoft
 <input class="modalEntity" id="entity2" type="checkbox" name="CompanySub">Apple
<br /> 
<input type="checkbox" class="entityCheckboxHeader2" id="entityCheckboxHeader" name="Country">Country
 <input class="modalEntity" id="entity3" type="checkbox" name="CountrySub">USA
 <input class="modalEntity" id="entity4" type="checkbox" name="CountrySub">UK​​​

Answer 2

If you can modify your HTML a little, you can come up with a general solution that will work with as many groups as you like (rather than just Country and Company).

HTML:

<input type="checkbox" class="entityCheckboxHeader" name="Company">Company
<input type="checkbox" name="CompanySub">Microsoft
<input type="checkbox" name="CompanySub">Apple
<input type="checkbox" class="entityCheckboxHeader" name="Country">Country
<input type="checkbox" name="CountrySub">USA
<input type="checkbox" name="CountrySub">UK

​JavaScript:

$(function(){
    $('.entityCheckboxHeader').click(function() {
        $('[name="'+this.name+'Sub"]').prop('checked', this.checked);
    });
});​

If you're not in a position to modify your HTML then the answer from Tats_innit is a nice, concise solution.

There's a JSFiddle of this solution here: http://jsfiddle.net/L5qqb/

Answer 3

First of all you should wrap your checkboxes with <label> so that when the label is clicked the checkbox is also toggled (user friendly).

Then i recommend using lists to group your checkboxes. (you can style them with css in any you want).

Something like this:

<ul>
    <li class="entityCheckboxHeader1" >
        <label><input type="checkbox" id="entityCheckboxHeader1">Company</label>
        <ul>
            <li><label><input id="modalEntity11" class="entity1" type="checkbox" name="company[]">Microsoft</label></li>
            <li><label><input id="modalEntity12" class="entity2" type="checkbox" name="company[]">Apple</label></li>
        </ul>
    </li>
    <li class="entityCheckboxHeader2">
        <label><input type="checkbox" id="entityCheckboxHeader2">Country</label>
        <ul>
            <li><label><input id="modalEntity21" class="entity3" type="checkbox" name="country[]">USA</label></li>
            <li><label><input id="modalEntity22" class="entity4" type="checkbox" name="country[]">UK​​​​​​​​​​​​​​​​​​​​​​​​​​​​​</label></li>
        </ul>
    </li>
</ul>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

Now you can use this very simply jquery to fullfill your task:

$("li :checkbox").change(function(){
    $(this).closest("li").find("ul :checkbox").prop("checked", $(this).is(":checked"));
});​

​ http://jsfiddle.net/eKTAk/3/

Note that I have changed the names of the fields so that you can read them like this in php a script (post form):

$companies = $_POST['companies']; //Gets the array of values for the checked companies

$countries = $_POST['countries']; //Gets the array of values for the checked companies