nzrnfourtwenty nzrnfourtwenty - 1 month ago 8
jQuery Question

Checkbox in multiple rows with jquery

What I want to do is to change a background color of a certain row that has been checked using a checkbox. The problem is, only the first row can be selected (colored).

php

<td align=center>
<input value='.$row['id'].' type=checkbox name=flag id=flag '.$tick.'>
</td>


jquery

$("#flag").on('change', function() {
var matching = $(this).closest('tr')
if($(this).prop('checked') == true) {
matching.css({'background-color':'rgba(175,0,0,0.2)'});
}
else {
matching.css({'background-color':'rgba(175,0,0,0)'});
}
});

Answer

You have the wrong selector for the event, try:

$("input[name='flag']").on('change', function() {
    var matching = $(this).closest('tr');   
    if($(this).is(':checked')) {
        matching.css({'background-color':'rgba(175,0,0,0.2)'});
    }
    else {
        matching.css({'background-color':'rgba(175,0,0,0)'});
    }
});