更改一个“页面”上显示的默认行数

问题描述 投票:0回答:7

使用 DataTables 的分页功能时,如何指定单个“页面”上显示的行数?

datatables
7个回答
92
投票

对于 DataTables 版本 1.10.5 及更高版本,如宣布集成 HTML5 data-* 属性的博客文章中所述,每页显示的行数可以通过源 (HTML) 表通过

data-page-length
属性:

<table data-page-length='25'>
     ...
</table>

对于 DataTables 版本 1.10 及更高版本,如参考 > 选项 > pageLength 中所述,可以通过

pageLength
属性指定每页显示的行数:

$('#example').dataTable( {
    "pageLength": 50
});

对于版本 1.10 之前的 DataTables,如DataTables > 使用 > 选项 > iDisplayLength 中所述,可以通过

iDisplayLength
属性指定每页显示的行数:

$('#example').dataTable( {
    "iDisplayLength": 50
});

我的两分钱:使用

data-*
方法。它允许您构建一个 dataTable 调用(您可以在整个应用程序中使用),同时提供配置每个单独表的行为方式的选项:

<!-- table with embedded custom configurations -->
<table class="apply_dataTable" data-page-length='25'>
     ...
</table>

<!-- table with different embedded custom configurations -->
<table class="apply_dataTable" data-page-length='50' data-order='[[2, "desc"]]'>
     ...
</table>

<!-- one JavaScript call enhances both tables above -->
<script>
    $('table.apply_dataTable').dataTable(); //one invocation of datatables treats each table they way it wants to be
</script>

26
投票

使用 lengthMenu 也可能有帮助:

$(document).ready(function() {
$('#example').DataTable( {
    "lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
} );

});

https://datatables.net/examples/advanced_init/length_menu.html


1
投票

共 10 条记录

$('#datatable').DataTable({"pageLength": 10});

共 50 条记录

$('#datatable').DataTable({"pageLength": 50});

所有记录

$('#datatable').DataTable({"pageLength": -1});

0
投票

使用版本 1.11 - 使用属性“data-show”。


0
投票

我们可以使用jquery设置属性并在一个公共文件中添加。

$('.dataTablegrid').attr('data-page-length',50);

这将适用于整个项目的所有数据表


-1
投票

您可以在数据表的J查询中编写以下代码

pageLength: 50,

-1
投票

$('#tableID').DataTable( {
“页面长度”:5 });

© www.soinside.com 2019 - 2024. All rights reserved.