I'm trying to implement a footerCallback in DataTables that computes a conditional sum of each column, based on a cell that's in a different column in the same row. Here's a demo of my setup: https://jsfiddle.net/rantoun/552y9j90/13/
HTML:
<table id="table1">
<thead>
<tr>
<th>Fruit</th>
<th>sumCondition</th>
<th># Eaten</th>
<th># Remaining</th>
</tr>
</thead>
<tfoot>
<tr>
<th></th>
<th align="center">Count</th>
<th align="left"></th>
<th align="left"></th>
</tr>
</tfoot>
<tbody>
<tr>
<td>Apples</td>
<td>Use</td>
<td>3</td>
<td>8</td>
</tr>
<tr>
<td>Oranges</td>
<td>Use</td>
<td>6</td>
<td>5</td>
</tr>
<tr>
<td>Bananas</td>
<td>Ignore</td>
<td>2</td>
<td>9</td>
</tr>
</tbody>
</table>
jQuery:
$("#table1").DataTable({
"paging": false,
"searching": false,
"info": false,
"footerCallback": function ( row, data, start, end, display ) {
var columns = [2, 3];
var api = this.api();
_.each(columns, function(idx) {
var total = api
.column(idx)
.data()
.reduce(function (a, b) {
return parseInt(a) + parseInt(b);
}, 0)
$('tr:eq(0) th:eq('+idx+')', api.table().footer()).html(total);
})
}
});
Specifically, my goal is for the footerCallback to only sum the rows where "Ignore" is NOT in the Condition column. Hopefully this is clear and any help is appreciated.
I solved this by getting the current index of the summing value in the reduce function, and then used the index to access the respective value in the condition cell. Below is the new jQuery code:
} });
Working Fiddle: https://jsfiddle.net/rantoun/552y9j90/14/