Jestem bardzo blisko osiągnięcia dokładnie tego, czego chcę, wystarczy niewielka pomoc.jquery datatables - suma kolumn w grupie
Mam pracę grupującą. Teraz chcę podsumować kolumny dla każdej grupy i wyświetlić sumę w nagłówku grupy. Oto jsfiddle od niego, ponieważ łatwiej jest pokazać, co usiłuję zrobić:
http://jsfiddle.net/RgKPZ/123/
Odpowiedni kod:
$(function() {
oTable = $('#job_history').dataTable({
"aoColumnDefs": [
{ "bVisible": false, "aTargets": [ 4,5,6 ] },
],
"aLengthMenu": [[10, 25, 50, -1], ["Show 10 entries", "Show 25 entries", "Show 50 entries", "Show all entries"]], // options in the show rows selector
"iDisplayLength" : -1, // show all rows by default
"aaSortingFixed": [[ 5, 'asc' ]],
"aaSorting": [[ 5, 'asc' ]],
"bJQueryUI": true,
"sDom": '<flip>', // filter, length, info, pagination
"oLanguage": {
"sSearch": "", // label for search field - see function below for setting placeholder text
"sLengthMenu": "_MENU_", // label for show selector { "sLengthMenu": "Display _MENU_ jobs" }
"sInfo": "Showing _START_ to _END_ of _TOTAL_ entries.", // string for information display
"sInfoEmpty": "No entries to show", // what to show when info is empty
"sInfoFiltered": " (Filtering from _MAX_ entries.)",
"sEmptyTable": "There are no entries matching the search criteria.", // shown when table is empty, regardless of filtering
"sZeroRecords": "", // shown when nothing is left after filtering
},
"fnDrawCallback": function (oSettings) {
if (oSettings.aiDisplay.length == 0)
{
return;
}
var nTrs = $('#job_history tbody tr'); // get all table rows
var iColspan = nTrs[0].getElementsByTagName('td').length;
var sLastGroup = "";
var summed_minutes = 0;
for (var i = 0; i < nTrs.length; i++)
{
var iDisplayIndex = oSettings._iDisplayStart + i;
var sGroup = oSettings.aoData[ oSettings.aiDisplay[iDisplayIndex] ]._aData[ 5 ];
if (sGroup != sLastGroup)
{
var nGroup = document.createElement('tr');
var nCell = document.createElement('td');
nCell.colSpan = iColspan;
nCell.className = "group";
summed_minutes += oSettings.aoData[ oSettings.aiDisplay[iDisplayIndex] ]._aData[ 7 ];
nCell.innerHTML = sGroup + summed_minutes;
nGroup.appendChild(nCell);
nTrs[i].parentNode.insertBefore(nGroup, nTrs[i]);
sLastGroup = sGroup;
}
}
}
});
});
Jedynym problemem jest to, że kolumny chcę podsumować aren są dodawane razem. Wyświetlane są wartości, ale jak ciąg znaków, zamiast sumowania podobnych liczb. Ponadto, nie wszystkie wartości są wyświetlane jako ciąg znaków - powtarzają się ciągi. Próbowałem konwersji za pomocą Number() i parseInt(), ale bez powodzenia. Próbuję umieścić to w funkcji wywołania zwrotnego (podobnie jak funkcja grupowania), aby wartości zostały zsumowane również po każdym filtrze tabeli.
Jestem pewien, że mam zmienną niewłaściwą lub w niewłaściwym miejscu lub coś, ale po prostu nie mogę tego rozgryźć. Frustrująco blisko! :-(
TIA, Matt
dla której kolumny chcesz wszystkich i jakie są grupy? –
Aby dodać wszystkie komórki w 5. kolumnie użyj tego '$ (" table tr td: nth-child (4) "). each (function() { total + = parseFloat ($ (this) .text()); }); ' –
Dzięki za pomoc. Jestem bliżej, ale wciąż nie do końca. Zaktualizowałem jsfiddle, aby pokazać, gdzie teraz jestem. http://jsfiddle.net/RgKPZ/126/ – Matt