Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
437 views
in Technique[技术] by (71.8m points)

datatables - Change the default number of rows to display on one "page"

How can I specify the number of rows to display on a single "page" when using DataTables's pagination feature?

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

For DataTables version 1.10.5 and newer, as documented on the blog post announcing the integration of HTML5 data-* attributes, the number of rows to show per page can be specified via the source (HTML) table through the data-page-length attribute:

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

For DataTables version 1.10 and newer, as documented at Reference > Options > pageLength, the number of rows to show per page can be specified via the pageLength attribute:

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

For DataTables older than version 1.10, as documented at DataTables > Usage > Options > iDisplayLength, the number of rows to show per page can be specified via the iDisplayLength attribute:

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

My two cents: use the data-* approach. It allows you to construct one dataTable call (that you can use throughout your app) while providing the option to configure how each individual table behaves:

<!-- 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>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...