Display time taken to load the datatable
Display time taken to load the datatable
We are using server side processing for data table pagination. Here is what it looks like:
$('.example').dataTable( {
"processing": true,
"serverSide": true,
"ajax": "some/script/",
"sPaginationType": "bootstrap",
"iDisplayLength": 50,
"bStateSave": true,
"aLengthMenu": [[50, 100, -1], [50, 100, "All"]],
"fnStateSave": function (oSettings, oData){
localStorage.setItem('reports', JSON.stringify(oData));
},
"fnStateLoad": function (oSettings){
var data = localStorage.getItem('reports');
return JSON.parse(data);
},
"oLanguage": {
"sLengthMenu": "MENU records per page",
"sSearch": "Filter:"
},
"aoColumnDefs": [{"bSortable": false, "aTargets": ["nosort"]},
{"sWidth": "40em", "aTargets": ["fixedwidth"]}],
"aaSorting": [[ 0, "asc"]],
"fnRowCallback": function(nRow, aData, iDisplaIndex) {
$('td', nRow).each(function(index) {
.....
});
return nRow;
}}
Everything works fine with the processing. I would like to add a note at the bottom of the datatable to indicate how much time it took for the data table to load. What would be the best way to go about it?
This question has an accepted answers - jump to answer
Answers
I haven't tested this, but as the serverside parameter maps to a jQuery.ajax() function call, according to the documentation, all the methods of the .ajax function are available to DataTables. In which case, you could use beforeSend to start a timer, and then complete to stop a timer, thereby timing how long it took to make the ajax call and finish receiving the data.