I am adding the values of a datatable with the Footer callback function but add only those td without any html tag, however I printed the td with a button and the function Footer callback does not recognize them and throws me this result = $ NaN ($ NaN total) , as I can solve it ..
-- -- --Codigo de Ajax Listado-- -- -- -- --
$(document).ready(function() {
//alert( f.getDate() + "/" + (f.getMonth() +1) + "/" + f.getFullYear() );
table = $('#table').DataTable({
"scrollX": true,
"scrollY": "240px",
"lengthMenu": [
[5, 15, 25, 50, 100, -1],
[5, 15, 25, 50, 100, "Todo"]
],
"scrollCollapse": true,
"processing": true, //Feature control the processing indicator.
"serverSide": true, //Feature control DataTables' server-side processing mode.
"order": [], //Initial no order.
"language": {
"lengthMenu": "Mostrar _MENU_ registros por pagina",
"zeroRecords": "No se encontraron resultados en su busqueda",
"searchPlaceholder": "Buscar registros",
"info": "Mostrando de _START_ al _END_ de _TOTAL_ registros",
"infoEmpty": "No existen registros",
"infoFiltered": "",
"search": "Buscar:",
"processing": "Procesando...:",
"paginate": {
"first": "Primero",
"last": "Último",
"next": "Siguiente",
"previous": "Anterior"
},
},
// Load data for the table's content from an Ajax source
"ajax": {
"url": "<?php echo base_url(); ?>planilla/ajax_list",
"type": "POST"
},
//Set column definition initialisation properties.
"columnDefs": [{
"targets": [-1], //last column
"orderable": false, //set not orderable
}, ],
"footerCallback": function(row, data, start, end, display) {
var api = this.api(),
data;
// Remove the formatting to get integer data for summation
var intVal = function(i) {
return typeof i === 'string' ?
i.replace(/[\$,]/g, '') * 1 :
typeof i === 'number' ?
i : 0;
};
// Total over all pages
total = api
.column(3)
.data()
.reduce(function(a, b) {
return intVal(a) + intVal(b);
}, 0);
// Total over this page
pageTotal = api
.column(3, {
page: 'current',
currency: "USD"
})
.data()
.reduce(function(a, b) {
return intVal(a) + intVal(b);
}, 0);
// Update footer
$(api.column(3).footer()).html(
'$' + pageTotal + ' ( $' + total + ' total)'
);
}
});
});-------Codigo de controlador -------
public function ajax_list() {
$list = $this->Planilla_model->get_datatables();
$data = array();
$no = $_POST['start'];
foreach ($list as $traba) {
$originalDate1 = $traba->fechaInTraba;
$newDate1 = date("d-m-Y", strtotime($originalDate1));
$originalDate2 = $traba->fechaCese;
$newDate2 = date("d-m-Y", strtotime($originalDate2)); $originalDate3 =
$traba->fechaBoleta;
$newDate3 = date("d-m-Y", strtotime($originalDate3));
$no++;
$row = array();
$row[] = $no;
$row[] = '<button class="estilo" style="width: 100%; border:none; background-color: rgba(0, 0, 0, 0); padding:0; margin:0; text-align: right;" onclick="vista(' . " '" . $traba->idPlanilla . "' " . ')">' . $traba->remuneracion . '</button>';
$row[] = '<button class="estilo" style="width: 100%; border:none; background-color: rgba(0, 0, 0, 0); padding:0; margin:0; text-align: right;"
onclick="vista(' . " '" . $traba->idPlanilla . "' " . ')">' . $traba->totaldsctos . '</button>';
$row[] = $traba->tnetopagar;
$row[] = '<button class="estilo" style="width: 100%; border:none; background-color: rgba(0, 0, 0, 0); padding:0; margin:0; text-align: right;"
onclick="vista(' . " '" . $traba->idPlanilla . "' " . ')">' . $traba->essalud . '</button>';
$data[] = $row;
}
$output = array( "draw" => $_POST['draw'],
"recordsTotal" => $this->Planilla_model->count_all(),
"recordsFiltered" => $this->Planilla_model->count_filtered(),
"data" => $data, ); //output to json format
echo json_encode($output);
}