I have a Datatable that uses static data from an HTML file.
Using either the "columnDefs data" function, or the "columnDefs render" function, I can perform some output adjustment - blanking out some of the TD's based on their content, and their position on the currently displayed page (without altering the data source).
However, when a user changes the number of displayed rows, I then need to reset & redo my adjustments on the data, as different cells will now need blanking, and previously blanked entries may need showing again.
So, what I want to do is in the "length.dt" event (number of display rows just changed), call something that causes the Datatable to either re-render the entire table, or re-load the entire data (which would thereby call my columnDefs render or columnDefs data functions)
Is this possible? Or is my approach flawed and I need to find another way?
Use rows().invalidate()
to invalidate data for all rows and draw()
to redraw the table.
Please note that 'data'
in rows().invalidate('data')
is required if you use Javascript data structure (with data
or columns.render
options).
$('#your_table').DataTable()
.rows().invalidate('data')
.draw(false);
You can redraw the entire DataTable on the length.dt event.
$('#your_table').on('length.dt', function (){
setTimeout(function() {
//draw('page') redraws your DataTable and preserves the page where it was
$('#your_table').DataTable().draw('page');
}, 100);
});
Edit
Here you can see more info and other parameters to pass to the draw method: https://datatables.net/reference/api/draw%28%29
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With