JS - How to change background color of the selected line checked with knack custom js code to add checkboxes?

I'm using this code from knack devs page, but I would like to upgrade it in order to change the line background color when the user checks the box of this line. Can any one tell me the code line to make it happen?

Tks!

// function that adds checkboxes
var addCheckboxes = function (view) {

// add the checkbox to to the header to select/unselect all
$('#' + view.key + '.kn-table thead tr').prepend('<th><input type="checkbox"></th>');
$('#' + view.key + '.kn-table thead input').change(function () {

$('.' + view.key + '.kn-table tbody tr input').each(function () {
$(this).attr('checked', $('#' + view.key + '.kn-table thead input').attr('checked') != undefined);
});
});

// add a checkbox to each row in the table body
$('#' + view.key + '.kn-table tbody tr').each(function () {
$(this).prepend('<td><input type="checkbox"></td>');
});
}

// add checkboxes to a specific table view (view_5). Change "view_5" to your view key
$(document).on('knack-view-render.view_289 , knack-view-render.view_2487 , knack-view-render.view_2485 , knack-view-render.view_2824 , knack-view-render.view_2823', function (event, view) {
addCheckboxes(view);
});

// Cycle through selected checkboxes. Use this in any code that needs to get the checked IDs
$('#view_289 tbody input[type=checkbox]:checked').each(function () {
// add code here to get record id or row value
var id = $(this).closest('tr').attr('id'); // record id
});

Tks!!!!

 

Worked! And if I select all checkboxes at once?

 

// add the checkbox to to the header to select/unselect all
$('#' + view.key + '.kn-table thead tr').prepend('<th><input type="checkbox"></th>');
$('#' + view.key + '.kn-table thead input').change(function () {

$('.' + view.key + '.kn-table tbody tr input').each(function () {
$(this).attr('checked', $('#' + view.key + '.kn-table thead input').attr('checked') != undefined);
});

Hello Guli,

 

Sorry for the delay.  Yes i see the issue in code 

 

Change var checked=$(this).id(":checked");

to var checked=$(this).is(":checked");

 

i place id instaed of is ..

 

Regards,

Sunny Singla

Hi Sunny! Tks for the code, but it did not work for me..

Hello Guli,

 

try below code 

 

$('#view_289 tbody input[type=checkbox]').live("click",function(){
var checked=$(this).id(":checked");
if(checked)
{
var obj=$(this).closest('tr');
$(obj).attr("style","color:red");
}
else
{
var obj=$(this).closest('tr');
$(obj).removeAttr("style");
}
});

 

Regards,

Sunny Singla

ssingla1985@gmail.com

+919855089359