I'm new to jquery datatable.
What I'm trying to achieve is, to toggle(hide/show) the row of datatable which is having attribute named status_id with value 9 to 13 on button click.
I have tried this for only number 9, but it's not working.
var dTable = $('#tbl_taskList').DataTable();
$(document).on('click', '.hide-tasks', function (e) {
e.preventDefault();
var row = dTable.row($(this).attr('status_id'));
if(row === '9') {
dTable.row().hide();
}
});
There is no hide() feature for rows. Basically is what you are trying to do a specialized filter, so you could create a custom filter to achieve what you want. Here is an example of a toggleable filter which hide or shows <tr>'s with status_id 9 or 13 :
$('#hide-tasks').on('click', function (e) {
//is the checkbox checked?
if ($(this).is(':checked')) {
//add filter
$.fn.dataTable.ext.search.push(function( settings, data, dataIndex ) {
//always go through the API when working with dataTables!
var status_id = parseInt(table.row(dataIndex).nodes().to$().attr('status_id'))
return !~[9,13].indexOf(status_id)
})
} else {
//reset filter
$.fn.dataTable.ext.search.pop()
}
//update table
table.draw()
})
demo -> http://jsfiddle.net/k1cz6rma/
Datatables docs says table.row hasn't hide fucntion but row().child() does.
var row = dTable.row(':eq('+$(this).attr('status_id')+')');
row.child().hide(); // hides
row.child().show(); // shows
checkout this page
