Recalculate the widths used by responsive after a change in the display. Please note - this property requires the Responsive extension for DataTables.
If a table is initialised while it is hidden (i.e.
display: none) the browser will not calculate the width of columns (since the non-displayed element has no width!). As such, Responsive's calculations for which columns to show at the various widths will be incorrect in this situation.
To resolve this problem, this method is made available to trigger a recalculation of the column widths used by Responsive. Call it once the table is made visible to have Responsive display correctly.
It is worth noting that in many ways this method is similar to
columns.adjust() and you will likely wish to use both together (see examples below).
Recalculate the widths used by responsive after a change in the display
DataTables API instance
Recalculate the responsive actions once the table is made visible:
var table = $('#example').DataTable(); $('#example').css( 'display', 'table' ); table.responsive.recalc();
$('#example').DataTable() .columns.adjust() .responsive.recalc();