如何删除数据表中的分页

92

我是jQuery的新手。我已经在网格中使用了数据表，但是不需要分页。

一页中有一个订单列表，我在Datatable网格中显示它们，但在底部，我不想显示分页。有什么方法可以通过使用jQuery库上的一些自定义来从数据表中删除或隐藏分页。

在此处输入图片说明

我尝试自定义它，但发现执行此操作的方法很少。

提前致谢。

— 托西夫·基尔吉
source

2

您使用哪种方法或插件？

— Naryl

163

您应该"bPaginate": false,在传递给构造函数参数的配置对象中包括该对象。如此处所示：http : //datatables.net/release-datatables/examples/basic_init/filter_only.html

— 仙人掌
source

1

如果我只想显示数据的前100行，则bPaginate不起作用，因为无论iDisplayLength参数如何，bPaginate都会显示所有数据。您知道如何避免这种情况吗？

— Alexis Dufrenoy 2014年

如果我错了，请纠正我，但是如果您仅显示前100个项目并禁用分页，则用户将无法显示以下结果。如果是这样，那么您应该尝试直接更改数据源。这似乎是一个不同的问题，因此您应该考虑打开一个新问题并提供一些代码。

— nstCactus 2014年

1

实际上，它是用于搜索功能的，我还需要显示一条消息，指出用户需要更改她的搜索条件，因为检索到的行太多。作为记录，我在Datatables论坛上询问，解决方案是添加一个选项：sDom = lfrt（无“ p”，无分页）。可能有用...

— Alexis Dufrenoy 2014年

72

禁用分页

对于DataTables 1.9

使用bPaginate选项禁用分页。

$('#example').dataTable({
    "bPaginate": false
});

对于DataTables 1.10+

使用paging选项禁用分页。

$('#example').dataTable({
    "paging": false
});

有关代码和演示，请参见此jsFiddle。

删除分页控制并启用分页

对于DataTables 1.9

使用sDom选项可配置哪些控制元素显示在页面上。

$('#example').dataTable({
    "sDom": "lfrti"
});

对于DataTables 1.10+

使用dom选项可配置哪些控制元素显示在页面上。

$('#example').dataTable({
    "dom": "lfrti"
});

有关代码和演示，请参见此jsFiddle。

— Gyrocode.com
source

2

对于1.10+，data-paging='false'在table元素上指定也将起作用。

— Jeromy French

21

工作正常

试试下面的代码

$('#example').dataTable({
    "bProcessing": true,
    "sAutoWidth": false,
    "bDestroy":true,
    "sPaginationType": "bootstrap", // full_numbers
    "iDisplayStart ": 10,
    "iDisplayLength": 10,
    "bPaginate": false, //hide pagination
    "bFilter": false, //hide Search bar
    "bInfo": false, // hide showing entries
})

— 穆罕默德·法哈德（Muhammad Fahad）
source

20

$(document).ready(function () {
            $('#Grid_Id').dataTable({
                "bPaginate": false
            });
        });

我已经解决了我的问题。

— 托西夫·基尔吉
source

12

$('#table_id').dataTable({    
    "bInfo": false, //Dont display info e.g. "Showing 1 to 4 of 4 entries"
    "paging": false,//Dont want paging                
    "bPaginate": false,//Dont want paging      
})

试试这个代码

— Abhishek B Patel
source

6

如果您要删除分页并且想要对dataTable进行排序，则在页面末尾添加此脚本！

<script>
$(document).ready(function() {        
    $('#table_id').DataTable({
        "paging":   false,
       "info":     false
    } );
      
  } );
</script>

展开摘要

— 莫辛·舒卡特（Mohsin Shoukat）
source

-1

这是一种替代方案，是对其他几个答案的逐步改进。假设settings.aLengthMenu不是多维的（可能是当DataTables具有行长和标签时）并且页面加载后数据不会更改（对于简单的DOM加载的DataTables），则可以插入此函数以消除分页。它隐藏了几个与分页相关的类。

也许更健壮的方法是在下面的函数中将分页设置为false，但是我暂时没有看到API调用。

$('#myTable').on('init.dt', function(evt, settings) {
    if (settings && settings.aLengthMenu && settings.fnRecordsTotal && settings.fnRecordsTotal() < settings.aLengthMenu[0]) {
        // hide pagination controls, fewer records than minimum length
        $(settings.nTableWrapper).find('.dataTables_paginate, .dataTables_length, .dataTables_info').hide();
    }
}).DataTable();

— 瑞安
source