Jquery change method and bulk class adding

Question

Hello I have a table (with class name ".data") with it's thead holding a single checkbox for selecting / deselecting all checkboxes inside my tbody.

Also each checkbox inside the tbody can be selected invidually and once a checkbox is selected, it adds a new class to the selected row(for making background some other color for highlighting).

Now for this I have written such methods:

 function enableBulkCheckbox(){
     $(".checkall").change(function(){
        if ($(this).is(':checked')){
            $(".data input:checkbox").attr('checked', true);
        }
        else{
            $(".data input:checkbox").attr('checked', false);
        }
    });
}

function selectMark(box){
    if ($(box).is(':checked')){
        $(box).parent().parent().addClass("selected");
    }
    else{
        $(box).parent().parent().removeClass("selected");
    }
};

function applySelectMark(){
     $(".data tbody input:checkbox").change(function(){
        selectMark(this);
        alert("hooo");
    });
};

and I init enableBulkCheckbox() and

It seems like $(".data tbody input:checkbox").change cannot recognize if enableBulkCheckbox() is triggered. However selecting/deselecting all via the mass select checkbox works as expceted. How can this be solved so that once I click bulk checkbox, all rows can get the "selected" class.

mck89 mck89 · Accepted Answer · 2010-10-05T08:15:04

I think that the problem is that changing the "checked" attribute does not trigger the change event. Try to call the selectMark function in the enableBulkCheckbox function:

function enableBulkCheckbox(){
     $(".checkall").change(function(){
        var chks=$(".data input:checkbox");
        if ($(this).is(':checked')){
            chks.attr('checked', true);
        }
        else{
            chks.attr('checked', false);
        }
        chks.each(function(){
           selectMark(this);
        });
    });
}

Jquery change method and bulk class adding

1 Answers