Responsive recalc on table init complete

itajackass

Actually, i've created a global.js script file that is embedded on every page of my project.
The content is:

$(document).on( 'column-visibility.dt', 'table', function ( e, settings, column, state ) {
$.fn.dataTable.tables( {visible: true, api: true} ).columns.adjust().responsive.recalc().draw();
});

I use this piece of code to re-allign columns when I show/hide columns. It work for every table I have on my project, in all pages.

Now i'd like to use same logic to responsive.recalc for every datatables on init complete, because some time, after table init, columns are not aligned with header. I tryed this one without success:

$(document).on( 'initComplete.dt', 'table', function ( e, settings, column, state ) {
$.fn.dataTable.tables( {visible: true, api: true} ).columns.adjust().responsive.recalc().draw();
});

Any idea?

kthorngren

The event is init not initComplete. Maybe that will help?

Kevin

itajackass

Than you. It works!