all checkboxes need to be checked and unchecked with the main checkbox

Question

Can anyone help me with this?

I have two divs. In one div, I have a checkbox named allcheck, and in the other other div<

Answer 1

Try this:

var $ch = $("input[name='outCheck']").change(function() {
    $all.prop('checked', $ch.filter(':checked').length == $ch.length);
}),
$all = $('input[name=allCheck]').click(function () {
    $ch.prop('checked', this.checked);
});

http://jsfiddle.net/wKgZV/1/

This will select and deselect main checkbox automatically depending on how many outcheck checkboxes are checked.

Answer 2

Try this -

$('input[name=allCheck]').click(function(){
   $("INPUT[name='outCheck']").prop('checked', this.checked);
});

This will toggle all checkboxes having name outCheck on click of allCheck.

See demo

---

UPDATE

see updated demo here

This works as expected. If all checkboxes are manually checked then main checkbox also changes and vice versa if one child is unchecked, main checkbox also gets unchecked.

Answer 3

This code implements functionality to select and deselect all checkboxes

select and deselect

$(".select-all-checkbox").click(function () {
       $('input:checkbox').prop('checked', this.checked);
   });

If one item deselect then button CheckAll is UnCheck

$(".mainCheckboxClass")
        .click(
                function() {
                    if ($('input[class=mainCheckboxClass]:checked').length === $('input[class=mainCheckboxClass]').length)
                        $('.select-all-checkbox').prop("checked", true);
                    else
                        $('.select-all-checkbox').prop("checked", false);
});