Question

i m trying to make a function in jquery to disable a group of checkboxes on click one main checkbox

function is

function DisableCheckboxes(id)
{

    if($(this).is(':checked'))
    {
         $("input[name="+id+"]").each(function(){
            $(this).attr({
            'checked':false,
            'disabled':true});        
        });
    }
    else
    {
        $("input[name="+id+"]").each(function(){
            $(this).attr('disabled',false);        
        });
    }

}

and call it on click event as –

$(document).ready(function() {

$("#chkNotMatter").click(DisableCheckboxes('chklStatus'));

});

problem is
the click event donot gets applied and the main checkbox gets checked

Answer 1

You should pass a callback to the event handler, and you are instead calling DisableCheckboxes and returning the result. You should be using:

$(document).ready(function() {
  $("#chkNotMatter").click(function() { DisableCheckboxes.call(this, 'chklStatus'); });
});

Edit:
As noted on the updated snippet, you have to use call on DisableCheckboxes because you are referencing this on it so it references the checkbox dom element properly.

Also, you can shrink your DisableCheckboxes as follows, because attr modifies all the objects in the selector:

function DisableCheckboxes(id) {
    if ($(this).is(':checked')) {
         $("input[name="+id+"]").attr({
            'checked':false,
            'disabled':true
        });
    } else {
        $("input[name="+id+"]").attr('disabled',false);
    }
}