Question

I was working on checkboxes operation using jQuery. I wrote a small snippet of code to make it work.

When I check selectAll check box, it should select all the checkboxes whilst when I un-check any of the check box it should un-check the “select all” one. And, the behavior should toggle.

Please check this code snippet Check – UnCheck

Somehow I’m not convinced with my code. Recommend if I can do it in a better way. TIA.

Answer 1

$(function() {
    var elems = $('input[type="checkbox"]');

    elems.first().on('change', function() {
        $(this).siblings(elems).prop('checked', this.checked);
    }).end().not(':first').on('change', function() {
        elems.first()
             .prop('checked', ((this.checked ? elems.length - 1 : elems.length) == $(elems)
             .filter(':checked').length));
    });
});​

FIDDLE