Hi guys. I got a requirement where I need to check the checkboxes based on given input IDs

Ryan27

Link to test case:

vm.dataTableInstance = $('.datatable-basic').DataTable({
                data : vm.ListValues,
                columns : [
                           {data : 'selectedValue', orderable: false,
                            targets: 0, render : function(data, type, row){
                                return '<input className=select-checkbox type="checkbox"' + (data ? ' checked="checked"' : '') + '><span>&nbsp;</span>';**: 

Hi team , i got a requirement where I need to check the checkboxes based on given input IDs. Using a datatable button i have given the input ids for which i need the checkboxes to be checked. I am able to check the checkboxes of given input values. Here only td value is marked as checked but tr values does not have any selected class in it. Due to that when I am trying to fetch the selected rows , i didn't get any rows from the table even if the check boxes are checked. So my question is how will I add selected class in tr when I am constructing datatable:

Edited by Kevin:  Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

Ryan27

rowRef = $(rowRef);
        var dtRow = vm.dataTableInstance.row(rowRef.closest('tr'));
        var rowData = dtRow.data();
        var dtRowUpdate = vm.dataTableInstance.rows({selected:true});   
        var rowsData = dtRowUpdate.data();

Edited by Kevin:  Syntax highlighting. Details on how to highlight code using markdown can be found in this guide

kthorngren

Are you using the Select Extension? If yes then you might be interested in the checkox example. Use the row().select() API to select the row whether you use the checkbox example or your checkbox code.

Kevin

Ryan27

Hi Kthorngren, as you can see in my code when am instantiating my datatable while creating each row , i need that specific row to be selected by default based on some column values . So in my updated code based on selected value as true or else i need to make that row selected by default.

vm.dataTableInstance = $('.datatable-basic').DataTable({ data : vm.List, columns : [ { data : 'selectedValue', orderable: false, className: 'select-checkbox', targets: 0, render : function(data, type, row){ if(data === true){ $(this).closest('tr').addClass('selected'); } return '<span>&nbsp;</span>'; }}, { data: 'name', title : 'Name', width : '5%' }

Ryan27

based on selectedValue as true I need to make the row as selected by default.

``vm.dataTableInstance = $('.datatable-basic').DataTable({
data : vm.List,
columns : [
{ data : 'selectedValue', orderable: false,
className: 'select-checkbox',
targets: 0, render : function(data, type, row){
if(data === true){
$(this).closest('tr').addClass('selected');
}
return '<span> </span>';
}},
{ data: 'name', title : 'Name', width : '5%' }`

kthorngren

The columns.render function is for manipulating the row data not the row element. Use either createdRow or rowCallback to do this. createdRow runs once and rowCallback runs each time the table is drawn. Use rowCallback if the data changes and you need to continue selecting rows based on the changes. The docs for each have simple eamples.

Kevin