DataTables：页脚不会根据搜索更新答案

【问题标题】：DataTables: Footer doesn't get updated depending on the searchDataTables：页脚不会根据搜索更新
【发布时间】：2020-01-29 04:25:21
【问题描述】：

使用 JQuery 数据表，特别是下面的函数来汇总特定列中的总数

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;

    };
    var i;
    for (i = 27; i <=122; i++) { 
        if (api.column(i).data().length){
            var total = api.column( i ).data().reduce( function (a, b) {
                return intVal(a) + intVal(b);
                }) 
            }
        else { 
            total = 0
        };

        // Update footer
        $( api.column(i).footer() ).html(total);
    }
},

到目前为止一切正常，显示总计。

但是，当我搜索带有 table.columns(12).search('No',true,false).draw(); 之类的列时，页脚不会更新。

我读过https://datatables.net/forums/discussion/41651/should-footercallback-be-called-when-clearing-a-search-filter，它说调用draw()，它应该得到更新，但它没有

有什么建议吗？

【问题讨论】：

标签： jquery datatables

【解决方案1】：

您需要为所有column() API 方法调用指定第二个参数selector-modifier，并在检索列数据时使用{ search:'applied' } 应用搜索。默认情况下，当您使用column() API 方法时，DataTables 不会应用搜索。

例如：

var data = api.column(i, { search:'applied' }).data();
if (data.length){
    var total = data.reduce( function (a, b) {
        return intVal(a) + intVal(b);
    });
} else { 
    total = 0;
}

【讨论】：