zudolab jqAllCheck

Simple usage

1. Load jQuery and "jqAllCheck.js"

2. Specify the checkbox to control children's checkbox status (I call this "allCheck checkbox") and children checkboxes by using jQuery selector like following.

   new AllCheck({
       all: "#all",
       children: "#children input"
   });

   <h3><label><input type="checkbox" id="all" />all</label></h3>
   <ul id="children">
       <li><label><input type="checkbox" />child</label></li>
       <li><label><input type="checkbox" />child</label></li>
       <li><label><input type="checkbox" />child</label></li>
       <li><label><input type="checkbox" />child</label></li>
       <li><label><input type="checkbox" />child</label></li>
       <li><label><input type="checkbox" />child</label></li>
   </ul>

3. Then allCheck checkbox can control children checkboxs' status.
   If allCheck checkbox was checked, all children checkboxes will be checked.
   If all children checkboxes were checked, allCheck checkbox will be checked.
   If allCheck checkbox was unchecked, all children checkboxes will be unchecked.

Multiple set

The example above is about one pair of checkboxes.
You can associate multiple sets too.

new AllCheck({
    multiple: true,
    container: "div.checkGroup",
    all: "input.all",
    children: "ul input"
});

<div class="checkGroup">
    <h2><label><input type="checkbox" class="all" />all</label></h2>
    <ul>
        <li><label><input type="checkbox" />child</label></li>
        <li><label><input type="checkbox" />child</label></li>
        <li><label><input type="checkbox" />child</label></li>
        <li><label><input type="checkbox" />child</label></li>
        <li><label><input type="checkbox" />child</label></li>
        <li><label><input type="checkbox" />child</label></li>
    </ul>
</div>

This script will associate "input.all" with "ul input" in each "div.checkGroup".
jqAllCheck will find all "div.checkGroup" first then find "input.all" and "ul input" in it.

I recommend you to use single set example if you can specify the elements by ID.
Because ID selector is much faster than any other selector.