当显示的数量少于显示的数量时，无法隐藏每页的项目和数据表中的分页

Question

我有一个

Datatable

，如果返回 1 页，我想隐藏“每页项目”

dropdown

列表以及

pagination

。这在过滤表格时也需要起作用。

我正在使用：

.DataTable().page.info()

下面是我的代码

"fnDrawCallback": function () {
    var accountSearchDataTableInfo = $('#accountSearchDataTable').DataTable().page.info();

    if (accountSearchDataTableInfo.pages == '1') {
        console.log(accountSearchDataTableInfo.pages == '1')
        $('#accountSearchDataTable_length').hide();
        $('#accountSearchDataTable_paginate').hide();
    }

    if (accountSearchDataTableInfo.pages == 1) {
        console.log(accountSearchDataTableInfo.pages == 1)
        $('#accountSearchDataTable_length').hide();
        $('#accountSearchDataTable_paginate').hide();
    }
}

这给出了...

初始表加载表信息：

过滤后的表格信息：

正如您从我的

if

中看到的那样，我尝试了数字和字符串，但是当我在这些上执行

console.log

时，它会返回

true

，但项目仍然显示。

我已经尝试过

.hide()

和

.css('display', 'none')

，但似乎没有任何效果，我不知道还能尝试什么。

当我在开发工具中查看

element

时，添加了

style

属性，但后面没有任何内容：

初始表加载：

过滤表：

Answer 1

找到解决方案。我一直在寻找父级

DIV

，但看起来如果我使用每个单独的标识符，我可以隐藏它们。所以我的

IF

现在看起来像

if (accountSearchDataTableInfo.pages == '1') {
    $('.mb-2').hide(); // Items per page DD
    $('#accountSearchDataTable_previous').hide(); // Pagintator 'Previous' button
    $('#accountSearchDataTable_next').hide(); // Pagintator 'Next' button
    $('.paginate_button').hide(); // Pagintator page '1' button
}

Answer 2

您可以使用下面的API来确定页数

table.api().page.info().pages

如文档中所述：

https://datatables.net/reference/api/page.info()

并在绘制表格后使用

drawCallback()

如此处所述：

https://datatables.net/reference/option/drawCallback

当页面为 1 或更少时如何隐藏分页的示例：

$('#example').dataTable( {
    "drawCallback": function( settings ) {
        var api = this.api();

        var pagination = $(this).closest('.dataTables_wrapper').find('.dataTables_paginate');
        pagination.toggle(api.page.info().pages > 1);
    }
} );