Datatables "footerCallback"함수가 두 열의 결과를 표시하지 않음 (하나만 있음)

Question

하나의 단일 열 합계에 대해 작동하는 기존 코드를 사용하여 합계를 두 열에 표시하려고했습니다. 배열에 있지만 작동하지 않습니다. 이 간단한 배열 솔루션을 사용할 수 있습니까?

이

이것이 JS 인 https://jsfiddle.net/setbon/3mvmhL1v/

이다

$(document).ready(function() { 
var table = $('#example').DataTable({ 
    rowReorder: { 
    selector: 'td:nth-child(2)' 
    }, 
    responsive: true, 
    scrollX: true, 
    scrollY: "80vh", 
    scrollCollapse: true, 
     paging: true, 
    lengthChange: false, 
    lengthMenu: [ [10, 25, -1], [10, 25, "All"] ], 
    "order": [[ 0, "asc" ]], 
    "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,4]) 
      .data() 
      .reduce(function (a, b) { 
       return intVal(a) + intVal(b); 
      }, 0); 

     // Total over this page 
     pageTotal = api 
      .column([3,4], { page: 'current'}) 
      .data() 
      .reduce(function (a, b) { 
       return intVal(a) + intVal(b); 
      }, 0); 

     // Update footer 
     $(api.column([3,4]).footer()).html(
      total 
     ); 
    }, 
    buttons: ['pdf'] 
}); 

table.buttons().container() 
    .appendTo('#example_wrapper .small-6.columns:eq(0)'); 

}); $ (문서) .foundation();

두 개 이상의 열을 합치려면 https://datatables.net/plug-ins/api/sum() 당 추가 플러그인을 사용해야합니다. 그 플러그인에 대해서도 복사하고 쉽게 사용자 지정할 수있는 둘 이상의 열이있는 예제를 찾을 수 없었습니다.

In this SO question 코드는 내가 가지고있는 것과 매우 다르며 혼란 스럽습니다. 또한 this SO answer is difficult for me to understand and I don't know how to apply to resolve my problem

Answer 1

근무 예 : 내가 제대로 이해하면 https://jsfiddle.net/guanzo/wx5mr9vs/1/

, 당신은 2 열에서 같은 금액을합니다. 이것은 쉽게 달성되며 플러그인이 필요 없습니다.

첫 번째 행의 번호가 8 인 행에 월급 대신 "도쿄"가 있습니다. 이것이 jsfiddle에 $ NaN이있는 이유입니다.

둘째, 단일 열을 선택하는 데 api.column()이 사용됩니다. 여러 열을 선택하려면 함수 호출을 복수형 (api.columns([3,4]))으로 설정하면됩니다. 당신의 제공 jsFiddle에, 당신은 당신이 제 4 열 인덱스가없는 의미, 4 열이, 그래서 내가 문서가 잘 구성되어

$(api.columns([2,3]).footer()).html(
    '$'+total 
); 

했다 : https://datatables.net/reference/api/

이 편집 : 각 열 바닥 글에 포함 된 그것의 자신의 합계

https://jsfiddle.net/3mvmhL1v/4/

은 기본적으로 당신은 개별적으로 각각의 컬럼에 합산 작업을 수행해야합니다. 두 열의 합계를 하나의 변수로 결합해도 도움이되지 않습니다.

var sumColumns = [3,4] 

sumColumns.forEach(function(colIndex){ 
     // Total over all pages 
    var total = api 
     .column(colIndex) 
     .data() 
     .reduce(function (a, b) { 
      return intVal(a) + intVal(b); 
     }, 0); 

    // Update footer 
    $(api.columns(colIndex).footer()).html(
     total 
    ); 
})