DataTables footerCallback - 在另一個單元格上有條件

Question

我試圖在DataTables中實現一個footerCallback，它根據同一行中不同列中的單元格計算每列的條件總和。這是我設置的演示：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); 
     }) 

    } 
}); 

具體來說，我的目標是爲footerCallback只總結了行，其中 「忽略」 是不是在條件列。希望這是明確的，任何幫助表示讚賞。

Answer 1

我通過獲取reduce函數中的求和值的當前索引來解決此問題，然後使用索引訪問條件單元中的相應值。以下是新的jQuery代碼：

$("#table1").DataTable({ 
    "paging": false, 
    "searching": false, 
    "info": false,  
    "footerCallback": function (row, data, start, end, display) { 


    var columns = [2, 3]; 
    //console.log(data); 
    var api = this.api(); 

    // Get sumCondition and put in array  

    _.each(columns, function(idx) { 

     var total = api 
      .column(idx) 
      .data() 
      .reduce(function (a, b) { 
       // Find index of current value for accessing sumCondition value in same row 
       var cur_index = api.column(idx).data().indexOf(b); 
       if (api.column(1).data()[cur_index] != "Ignore") { 
       return parseInt(a) + parseInt(b); 
       } 
       else { return parseInt(a); } 
      }, 0)   

      $('tr:eq(0) th:eq('+idx+')', api.table().footer()).html(total); 
    }) 

} }）;

工作小提琴：https://jsfiddle.net/rantoun/552y9j90/14/