Checking all sub-checkboxes and un-checking

Question

How can I use a parent checkbox to check and un-check all child checkboxes.

E.g.

Checkbox ID               = 1
Child Checkbox ID         = 1-1
Child Checkbox ID             = 1-2
Grand-child Checkbox ID       = 1-2-1
Grand-child Checkbox ID       = 1-2-2

The code I've written so far uses the hat character ^ to check all checkboxes beginning with the ID of the selected checkbox, so for instance; Clicking 1 will attempt to check all boxes with an ID beginning with 1-. Checking 1-2 will check all checkboxes beginning with 1-2.

$("input[type='checkbox']").live('click', function() {
    var selected = $(this).attr('id').match(/\d+$/);
    alert(selected);
    $("input[id^='buCheck_"+selected+"-']").attr('checked','checked');
});

Answer 1

Try this one

Demo

Answer 2

How about this one?

http://jsfiddle.net/wfMXv/2/

Answer 3

You didn't really explain what your problem is. I'm guessing it doesn't work for the sub-checkboxes.

It's probably easiest to just drop the parsing of the id:

$("input[type='checkbox']").live('click', function() {
    var selected = $(this).attr('id');
    alert(selected);
    $("input[id^='"+selected+"-']").attr('checked','checked');
});