更改要在一个"页面"上显示的默认行数

Question

使用DataTables的分页功能时,如何指定在单个"页面"上显示的行数？

Answer 1

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

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

对于DataTables 1.10及更高版本,如Reference> Options> pageLength中所述,可以通过以下pageLength属性指定每页显示的行数:

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

对于版本低于1.10的DataTable,如DataTables> Usage> Options> 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>

Answer 2

使用lengthMenu也可能有所帮助:

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

});

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