DataTables footerCallback - 以另一个列值为条件

时间:2017-12-28 12:26:19

标签: html datatables

我正在尝试在DataTables中实现一个footerCallback,它根据位于同一行中不同列的单元格对某些列进行条件求和。任何人都可以帮我这个吗?我使用下面的代码并检查alert(cur_index);但我认为它没有按预期工作。而且我没有得到一列正确的值。我的代码是:

pageTotal6 = api
            .column( 6, { page: 'current'} )
            .data()
            .reduce( function (a, b) {
                var cur_index = api.column(6).data().indexOf(b);
                alert(cur_index);
                alert(api.column(3).data()[cur_index]);
                if (api.column(3).data()[cur_index] != "Pending review") {
                    return parseInt(a) + parseInt(b);
                }
                else { return parseInt(a); }
                    return intVal(a) + intVal(b);
            }, 0 );

在第3列中,我有一些重复值,我只想求第3列的不同值。我怎么能用datatable& amp; HTML

1 个答案:

答案 0 :(得分:1)

有两种方法可以解决这个问题。

第一种方法
(我假设您正在使用C#中的数据库[ViewModel]读取JSON数据,并使用服务器端处理)

使用下面的图片作为我如何解决问题的参考

enter image description here

我想总结一下“Amount”列,其中“Measure Type”(最后一列)!= 99.我用ViewModel做的第一件事是将列表传递给我的JSON对象是添加列总和列没有从表中读取任何MeasureType = 99行。

基本上我的JSON对象有两列读取Amount列数据,一个是可见的,你在图像中看到有所有数字,另一个看不见,只能读取我想在页脚中求和的值。

while (MyDataReader.Read())
{
   //get all other columns
   //column with amount figures measuretype != 99
   if (reportData.q_measuretype != 99)
   {
      reportData.amountNo99 = Convert.ToDecimal(String.Format("{0:0.00}", read["q_amount"]));
   }
   else
   {
      reportData.amountNo99 = 0;
   }

   list.Add(reportData);

}

在该步骤之后,然后在footerCallback函数中,您只需将不可见列相加就可以保持简单,因为当您在页面上获取行列表时已经设置了条件

totalNettNo99 = api
   .column(8, { page: 'current' }) //remember this is the last invisible column
   .data()
   .reduce(function (a, b) {
        return intVal(a) + intVal(b);
   }); 

然后,您可以使用可见列3(索引2)

上的总和更新页脚
$(api.column(2).footer()).html(
     '€' + totalNettNo99.toFixed(2)
);

请记住在“columnDefs”

中以这种方式设置invisble列
"ajax": {
                "url": "/Reports/loadTransactionList",
                "type": "POST",
                "datatype": "JSON"

            },

            "columnDefs": [

                {
                    "targets": [8],
                    "visible": false,
                    "searchable": false,
                    "render": false
                }
            ],

            "columns": [
                {
                    "data": "convertDateToString"
                },
                {
                    "data": "convertTimeToString"
                },
                {
                    "data": "q_receiptnumber"
                },

从图像中可以看出,只有具有吉尼斯品脱的行总和页脚上的总和。它有点打字但是如果你用脚本解决方案撕裂你的头发就解决了这个问题。

第二种方法
 你可以在这里看看这个答案纯粹是用脚本编写的,而不是输入我的解决方案

https://stackoverflow.com/a/42215009/7610106

归功于nkbved