I have below html for which I am getting error as
Uncaught TypeError: Cannot set properties of undefined (setting ‘_DT_CellIndex’)
function dispalySignOffSheetFTTX(ReportType, Month, DataList) {
var _reportType = (ReportType == 'ALL') ? "PAN INDIA" : ReportType;
var _month = Month;
var table = $('#grdCicleDatatable');
$(table).empty();
var thead = "";
var datalist = JSON.parse(DataList);
if (ReportType == 'ALL') {
thead = "<thead>< tr ><th rowspan='2' class='text-left'>Maintenance Zone</th><th colspan='3'>FTTX</th><th colspan='3'>Grand Total</th></tr><tr><th>UG</th><th>Aerial</th><th>MDU</th><th>UG</th><th>Aerial</th><th>MDU</th></tr></thead >";
}
var tbody = "<tbody>";
table.append(thead);
table.append(tbody);
if (datalist != null && datalist.length > 0) {
var grandTotalUG = 0;
var grandTotalAR = 0;
var grandTotalMDU = 0;
$.each(datalist, function (key, val) {
val.NE_LENGTH = val.NE_LENGTH == null ? 0 : parseFloat(val.NE_LENGTH);
val.UG_LENGTH = val.UG_LENGTH == null ? 0 : parseFloat(val.UG_LENGTH);
val.AR_LENGTH = val.AR_LENGTH == null ? 0 : parseFloat(val.AR_LENGTH);
val.MDU_LENGTH = val.MDU_LENGTH == null ? 0 : parseFloat(val.MDU_LENGTH);
grandTotalUG = val.UG_LENGTH;
grandTotalUG = grandTotalUG.toFixed(3);
grandTotalAR = val.AR_LENGTH;
grandTotalAR = grandTotalAR.toFixed(3);
grandTotalMDU = val.MDU_LENGTH;
grandTotalMDU = grandTotalMDU.toFixed(3);
var tr = "<tr id='" + val.ITEM + "'><td> " + val.ITEM + "</td><td class='text-center'> " + val.UG_LENGTH + "</td><td class='text-center'> " + val.AR_LENGTH + "</td><td class='text-center'> " + val.MDU_LENGTH + "</td><td class='text-center'> " + grandTotalUG + "</td><td class='text-center'> " + grandTotalAR + "</td><td class='text-center'> " + grandTotalMDU + "</td></tr>";
table.append(tr);
});
table.append('</tbody>');
}
//var footer = "<tfoot><tr><th colspan='1' style='text-align:center'><b>Total:</b></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th></tr></tfoot>";
var footer = "<tfoot><tr><th colspan='1' style='text-align:center'><b>Total:</b></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th><th class='text-center'></th></tr></tfoot>";
table.append(footer);
oTable = $(table).dataTable({
dom: 'tp',
"dom": 'tp<"bottom"B><"clear">',
"searching": false,
responsive: true,
"autoWidth": true,
"bDestroy": true,
"pageLength": 6,
paging: false,
"columnDefs": [
{ "width": "38.4%", "targets": 0 },
{ "width": "7.7%", "targets": 1 },
{ "width": "7.7%", "targets": 2 },
{ "width": "7.7%", "targets": 3 },
{ "width": "7.7%", "targets": 4 },
{ "width": "7.7%", "targets": 5 },
{ "width": "7.7%", "targets": 6 },
{ "width": "7.7%", "targets": 7 }
],
buttons: [
{
"extend": "excelHtml5", "text": "Export to Excel", "filename": _reportType + "_Fttx_SignOffSheet_" + _month,
title: 'Sign Of Sheet of ' + _reportType + ' Circle for ' + _month + ' Month',
messageBottom: '',
exportOptions: {
columns: ':visible',
format: {
header: function (data, columnindex, trDOM, node) {
return GetColumnPrefixFTTX(columnindex) + data;
}
}
}
}
],
"footerCallback": function (row, data, start, end, display) {
var api = this.api(), data;
// converting to interger to find total
var intVal = function (i) {
return typeof i === 'string' ?
i.replace(/[$,]/g, '') * 1 :
typeof i === 'number' ?
i : 0;
};
// computing column Total of the complete result
var FTTXUGTotal = api
.column(1)
.data()
.reduce(function (a, b) {
return intVal(a) + intVal(b);
}, 0).toFixed(2);
var FTTXARTotal = api
.column(2)
.data()
.reduce(function (a, b) {
return intVal(a) + intVal(b);
}, 0).toFixed(2);
var FTTXMDUTotal = api
.column(3)
.data()
.reduce(function (a, b) {
return intVal(a) + intVal(b);
}, 0).toFixed(2);
var TotFTTXUGTotal = api
.column(4)
.data()
.reduce(function (a, b) {
return intVal(a) + intVal(b);
}, 0).toFixed(2);
var TotFTTXARTotal = api
.column(5)
.data()
.reduce(function (a, b) {
return intVal(a) + intVal(b);
}, 0).toFixed(2);
var TotFTTXMDUTotal = api
.column(6)
.data()
.reduce(function (a, b) {
return intVal(a) + intVal(b);
}, 0).toFixed(2);
// Update footer by showing the total with the reference of the column index
$(api.column(0).footer()).html('Total');
$(api.column(1).footer()).html(FTTXUGTotal);
$(api.column(2).footer()).html(FTTXARTotal);
$(api.column(3).footer()).html(FTTXMDUTotal);
$(api.column(4).footer()).html(TotFTTXUGTotal);
$(api.column(5).footer()).html(TotFTTXARTotal);
$(api.column(6).footer()).html(TotFTTXMDUTotal);
},
initComplete: function () {
var btns = $('.dt-button');
btns.addClass('btn btn-danger button');
btns.removeClass('dt-button');
}
});
if (CurrentGroupName == UserGrouop.NHQPMO) {
$('.buttons-pdf').css("display", "none");
} else {
$('.buttons-excel').css("display", "none");
}
}