Change the default number of rows to display on one "page"
Using lengthMenu may help too:
$(document).ready(function() {
$('#example').DataTable( {
"lengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]]
} );
} );
https://datatables.net/examples/advanced_init/length_menu.html
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>