仅在显示所有条目时才显示页脚答案

【问题标题】：Display footer only if all the entries are shown仅在显示所有条目时才显示页脚
【发布时间】：2015-10-02 11:56:05
【问题描述】：

我已经使用 jQuery DataTables 几天了，只有在显示所有条目时才需要显示页脚。

例如，如果我的表中有18 数据行并选择显示9，则页脚应该不可见；如果显示所有18，则页脚应该可见。

目前，Datatable 页脚的代码如下所示：

<tfoot>
    <tr>
       <th colspan="1" style="text-align:left">Round: </th>
       <th style="text-align:center"></th>
       <th style="text-align:center"></th>
     </tr>

以及它的 JS 代码：

$("#TableDt" + rid).DataTable({
    "lengthMenu": [[18, 9], [18, 9]],
    bFilter: false,
    "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) {
            var alb3;
            if (typeof i == 'string') {
                var alb = i.split(">");
                var alb2 = alb[1].split("<");
                alb3 = parseInt(alb2[0]);
            }
            else if (typeof i === 'number')
                alb3 = i;
            else
                alb3 = 0;
            return alb3;
        };
        // Total over all pages
        totalT = api
            .column(2)
            .data()
            .reduce(function (a, b) {
                return intVal(a) + intVal(b);
            });
        totalP = api
            .column(1)
            .data()
            .reduce(function (a, b) {
                return intVal(a) + intVal(b);
            });
        var TimeP = 0;
        var TimeT = 0;

        var time = totalP;
        var time2 = totalT;
        var h1 = Math.floor(time / 60);
        var m1 = time % 60;
        var h2 = Math.floor(time2 / 60);
        var m2 = time2 % 60;
        if (h1 <= 9) {
            if (m1 <= 9)
                TimeP = '0' + h1 + ':0' + m1;
            else
                TimeP = '0' + h1 + ':' + m1;
        }
        else if (m1 <= 9)
            TimeP = h1 + ':0' + m1;
        else
            TimeP = h1 + ':' + m1;
        if (h2 <= 9) {
            if (m2 <= 9)
                TimeT = '0' + h2 + ':0' + m2;
            else
                TimeT = '0' + h2 + ':' + m2;
        }
        else if (m2 <= 9)
            TimeT = h2 + ':0' + m2;
        else
            TimeT = h2 + ':' + m2;

        $(api.column(1).footer()).html(
            '' + TimeP + ''
        );
        $(api.column(2).footer()).html(
            '' + TimeT + ''
        );
    }
});

我没有找到任何可以帮助我的东西。只有显示所有行才可以显示？

【问题讨论】：

标签： jquery html datatables

【解决方案1】：

解决方案

您可以将处理程序附加到search 事件在您的DataTable() 初始化代码之前。过滤表格时会触发此事件。

然后您可以使用search() 检索搜索查询，并根据查询确定是显示还是隐藏您的页脚。

$('#example').on( 'search.dt', function (e, settings) {
    var api = new $.fn.dataTable.Api( settings );
    var query = api.search();
    if(query === ''){
       $('#example tfoot').show();
    } else {
       $('#example tfoot').hide();    
    }       
});    

var table = $('#example').DataTable();

演示

有关代码和演示，请参阅this jsFiddle。

【讨论】：