Slow footerCallback
Slow footerCallback
Link to test case:
Debugger code (debug.datatables.net):
Error messages shown:
Description of problem: I am using the code below but without the footerCallback, loading takes 20 sec. With it it takes 10mins. Any idea how it can be improved. Many thanks.
dataTable1 = $('#tblDataTable1').DataTable({
order: [[1, 'desc']],
pageLength: 10,
dom: 'Bfrtip',
ajax: {
url: '/' + strAccountIdx1 + '/Admin/ContactTrans/CRUDContactTrans/',
data: function (d) {
return $.extend({}, d, {
intContTpe: booIsGlobal1 == 1 ? -1 : intContTpe1
});
},
type: 'GET',
dataType: 'json',
contentType: 'application/json; charset=utf-8',
async: true,
cache: false
},
responsive: true,
processing: true,
deferRender: true,
orderClasses: false,
paging: true,
//serverSide: true,
columns: [
{
data: null,
defaultContent: '',
orderable: false
},
{
data: 'ContactTrans.id', //1
className: 'text-left'
}
//...
],
rowCallback: function myRowCallback(row, data) {
if (IsTransTypeInvoiceLike(data.ContactTrans.TransType)) {
$('td:eq(0)', row).removeClass();
$('td:eq(0)', row).addClass('details-control');
}
else {
$('td:eq(0)', row).removeClass();
$('td:eq(0)', row).addClass('nodetails-control');
}
},
footerCallback: function (row, data, start, end, display) {
var api = this.api(), data;
// Remove the formatting to get integer data for summation
var intVal1 = function (i) {
return typeof i === 'string' ?
i.replace(/[\$,]/g, '') * 1 :
typeof i === 'number' ? i : 0;
};
var intVal2 = function (i) {
return typeof i === 'string' ?
i.replace(/[\$,]/g, '') * 1 :
typeof i === 'number' ? i : 0;
};
var intVal3 = function (i) {
return typeof i === 'string' ?
i.replace(/[\$,]/g, '') * 1 :
typeof i === 'number' ? i : 0;
};
// Total over all pages
dblNetTotal = api
.column(19, { search: 'applied' })
.data()
.reduce(function (a, b) {
return intVal1(a) + intVal1(b);
}, 0);
dblTaxTotal = api
.column(20, { search: 'applied' })
.data()
.reduce(function (a, b) {
var dblTaxAmount = 0;
$.each(data, function (i, e) {
$.each(e.ContactTransTaxes, function (i, e) {
dblTaxAmount += e.TaxAmount;
});
});
return dblTaxAmount;
}, 0);
dblGroTotal = api
.column(21, { search: 'applied' })
.data()
.reduce(function (a, b) {
return intVal3(a) + intVal3(b);
}, 0);
// Update footer
$('tr:eq(0) th:eq(1)', api.table().footer()).html((booIsGlobal1 == 0 ? strCurrency1 + ' ' : '') + ManageDecimals(4, dblNetTotal));
$('tr:eq(1) th:eq(1)', api.table().footer()).html((booIsGlobal1 == 0 ? strCurrency1 + ' ' : '') + ManageDecimals(4, dblTaxTotal));
$('tr:eq(2) th:eq(1)', api.table().footer()).html((booIsGlobal1 == 0 ? strCurrency1 + ' ' : '') + ManageDecimals(4, dblGroTotal));
},
select: {
style: 'os',
selector: 'td:not(:first-child)'
},
initComplete: function () {
var dt = new Date();
var time = dt.getHours() + ":" + dt.getMinutes() + ":" + dt.getSeconds();
PrintToOutput('Open complete: ', time);
}
});
Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.
This discussion has been closed.
Answers
How many rows do you have?
I don't understand the code for
dblTaxTotalin line 72. I think this is where the problem is. You are using the reduce function to loop through the data in column 20 but not using the variablesaandb. Inside the reduce loop you are using$.each(data, function (i, e) {to loop through all the rows. So if you have 100 rows the reduce function will execute 100 times, once for each row. In side that loop the$.each()function will execute 100 times, once for each row. Unless my calculations are wrong that is 10,000 loop executions each time thefooterCallbackis called.Kevin
Thanks a lot. I will review things and streamline where i can