Manually set 'processing' state for a DataTable?

zmaniacz

I have a single AJAX call that retrieves the dataset needed for multiple tables on a page. Right now I initialize all the empty tables as DataTables, and then use a jQuery $.ajax call and in the .done() call, add the data to the empty tables via rows.add().

My issue is that during this ajax call, the tables just look empty and I'd like to instead use the processing state to show that data is coming. I can't find a way to turn this on via the API, so is there a different logical way I should structure the code to achieve this?

I can see in the HTML that DataTables injects a div called #myTable_processing with "display: none;" set. I could just update this after table initialization to be shown and then let DataTables hide it again later, but seems a little hacky.

Some code for reference:

        $('#current_win_streak_table').DataTable( {
            columns : [
                { "data" : "player_name" },
                { "data" : "maxstreak" },
            ]
        });

        $('#current_loss_streak_table').DataTable( {
            columns : [
                { "data" : "player_name" },
                { "data" : "maxstreak" },
            ]
        });

        $.ajax({
            url: "getCurrentStreaks.php"
        }).done(function(response) {
            $('#current_win_streak_table').DataTable().clear().rows.add(response.data.winStreaks).draw();
            $('#current_loss_streak_table').DataTable().clear().rows.add(response.data.lossStreaks).draw();
        })

allan

This plug-in API method can be used to do it.

Regards,
Allan