Question

My problem is that when the checkbox below is clicked – the check function is called to check/uncheck all the checkboxes. But they have to change relatively to the invoking checkbox (the one with the “onchange” event).

The checkbox HTML declaration:

<input type="checkbox" onchange="$('input[type=checkbox][rel=users]').check();">

Sample JavaScript Code:

$.fn.check = function() {
    $(this).each(function(){
        $(this).attr('checked', checked);
    });
}

And my question is: How can I get the DOM object corresponding to the “check all” checkbox?

Answer 1

Edit: Pass the this object of the checkAll to the function.

DEMO

<input type="checkbox" 
   onchange="$('input[type=checkbox][rel=users]').check(this);" />

Note the this is passed as .check(this)

And in the JS:

$(document).ready(function() {
    $.fn.check = function(orgEl) {
        $(this).each(function() {
            $(this).attr('checked', orgEl.checked);
        });
    }
});

Old Post –

Bind the checkAll checkbox to an handler and call the fxn from inside.. See below,

HTML

<input type="checkbox" id="checkAll" >

JS

   $(document).ready (function () {
       $('#checkAll').click (function () {
          //this inside is checkAll checkbox object.
          $('input[type=checkbox][rel=users]').check();
       });
   });