Determine if DataTables is done in version 1.10. Is there a callback?

Question

How can I determine if DataTables() is done rendering in version 1.10 and above? Is there a callback somewhere I can set to a function. I'd like to hide my table until DataTables is finished and then reveal it once it is done loading.

With version 1.10, I haven't come across a callback, and I think a lot of the old callbacks are now deprecated as their links redirect me to legacy.datatables.net

Answer 1

You can use init.dt event as follows:

$('#example').on('init.dt', function(e, settings, json){
    console.log( 'Table initialisation complete: '+new Date().getTime() );
});

$('#example').dataTable();

From the manual:

init event is called when your table has fully been initialised, data loaded and drawn, particularly when using an ajax data source.

NOTES

If you're going to hide/show the table, you would need to use columns.adjust() API method to recalculate column widths once table becomes visible.

For example:

$('#example-container').hide();

$('#example').on('init.dt', function(e, settings, json){
    $('#example-container').show();

    $(this).DataTable().columns.adjust();
});

$('#example').dataTable();