Datatables.net ajax reload loading message

Question

On initial load of my datatable via ajax, the table shows no data and 'Loading...' appears in the table body.

On DataTable().ajax.reload(), the 'Loading...' text is not present.

I know I can turn on the processing option to get the bar across the table, but if I do this then on initial loading my users see both 'Loading...' in the table body and 'Processing...' on top of that.

Has anyone found a solution to have one all the time or the other? I would prefer to replace the table body with 'Loading...' for each ajax reload.

Thanks!

Yolandoyolane

Answer 1

With Datatables 1.10 I had the same issue. I found a way to get this to work. If you use the preXhr event which fires before the ajax call you can

1. clear the table
2. Set the draw count back to 0, which triggers the initial message again

3. ReDraw the table and loading will appear.

   mydataTable.on('preXhr.dt', function(e, settings, data){
       $(this).dataTable().api().clear();
       settings.iDraw = 0;   //set to 0, which means "initial draw" which with a clear table will show "loading..." again.
       $(this).dataTable().api().draw();
   });
   

Dedal

Actually for me, setting the settings.iDraw = 0; did not show the loading message on subsequent data reloads. It still showed "No data available in table" while loading data. I had to set the iDraw property to -1 to have the "Loading..." message appear upon ajax reloads. – Rhiannonrhianon

Great solution when you don't want to use the processing feature and you need reload by ajax. – Saguaro

Answer 2

There are "language" options where you can dictate what shows up during various events. DataTables has great documentation showing it. https://datatables.net/reference/option/language.processing

Ericson

I know, I mention that in my question. I'm trying to find a solution that does not have both the processing bar and the loading table body text on initial load. – Yolandoyolane