Cześć,
Od jakiegoś czasu męczę się z utworzeniem wiersza sumującego wartości z tabeli.
Tak wygląda tabela w pętli While:
printf("<div class='panel panel-default%s'>
<div class='panel-heading' role='tab' id='heading%s'>
<h4 class='panel-title'>
<a role='button' data-toggle='collapse' data-parent='#accordion' href='#collapse%s' aria-expanded='false' aria-controls='collapse%s'>
<table class='table' id='suma' style='border-top: 0px solid white; margin-bottom: 0px;'>
<tbody>
<tr style='font-weight: bold;'>
<td class='col-md-4'>%s</td>
<td class='col-md-2'>Zap: %s</td>
<td class='col-md-2 success'>AKC: %s</td>
<td class='col-md-1'>W: %s</td>
<td class='col-md-1'>Dod: %s</td>
<td class='col-md-1%s'>Nod: %s</td>
<td class='col-md-1'>Odr: %s</td>
</tr>
</tbody>
</table>
</a>
</h4>
</div>
Kod JavaScript który mam do sumowania innych tabel:
$(document).ready(function() {
$('#suma').DataTable( {
"columnDefs": [ {
"targets": [1],
// "render": function() { return "30"}
}],
"footerCallback": function ( row, data, start, end, display ) {
var api = this.api();
// 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;
};
rendered = api
.cells( null, 1, { page: 'current'} )
.render('display')
.reduce( function (a, b) {
return intVal(a) + intVal(b);
}, 0 );
// Update footer
$( api.column( 1 ).footer() ).html(
''+ rendered
);
}
});
});
Tak wygląda tabela:
Jak widać ostatni wiersz nie sumuje, a w kodzie wygląda on tak, dodany poza pętlą while:
echo "<div class='panel panel-default'>
<div class='panel-heading' role='tab'>
<h4 class='panel-title'>
<table class='table' style='border-top: 0px solid white; margin-bottom: 0px;'>
<tfoot>
<tr style='font-weight: bold;'>
<th class='col-md-4' rowspan='1' colspan='1'>Suma</th>
<th class='col-md-2' rowspan='1' colspan='1'>Zap: </th>
<th class='col-md-2 success' rowspan='1' colspan='1'>AKC: </th>
<th class='col-md-1' rowspan='1' colspan='1'>W: </th>
<th class='col-md-1' rowspan='1' colspan='1'>Dod: </th>
<th class='col-md-1' rowspan='1' colspan='1'>Nod: </th>
<th class='col-md-1' rowspan='1' colspan='1'>Odr: </th>
</tr>
</tfoot>
</table>
</h4>
</div>";