Fire event on Jquery check/uncheck

Question

I want to set a variable (pageselected) as per the checkbox click/unclick event.

The HTML code is :

<thead>
    <tr id="othercheckbox">
        <th width="10"><input type="checkbox" name="zip" class="all"  value="all" /></th>              
    </tr>
</thead>
    

The code in JS file is :

$('#othercheckbox').click(function() {

    if($(this).is(':checked')){
        console.log("CCCCheckeddddddd");
        that.pageselected = true;
    }
    else
    {
        console.log("UNCheckeddddddd");
        that.pageselected = false;
    }
}
      

But this is not behaving as expected. Where am I going wrong?

Answer 1

You are checking the row is checked or not, which is not possible.bind onchange event on the checkbox. put it on the checkbox let say checkbox1.

HTML Code:

<input type="checkbox" name="zip" id="checkbox1" class="all"  value="all" />

JS Script:

$('#checkbox1').change(function(){

    if($(this).is(':checked')){
        console.log("CCCCheckeddddddd");
    }
    else
    {
        console.log("UNCheckeddddddd");
    }    

});

Answer 2

JSFIDDLE DEMO

Since the checkbox is inside the tr with id othercheckbox .. Use this

$('#othercheckbox input[name="zip"]').click(function () {
    if ($(this).is(':checked')) {
        alert("CCCCheckeddddddd");
        //that.pageselected = true;
    } else {
        alert("UNCheckeddddddd");
        //that.pageselected = false;
    }
});