jQuery DataTables Pagination Size

Question

I've been using jQuery DataTables plugin ( http://datatables.net ) for quite some time and usually we're super fine using the default sizes and using "bStateSave": true option.

But now I really need to set the sizing of the pagination not as [10,25,50,100] but rather I need this as let's say [1,2,3]. I get the menu to set like this with setting the option aLengthMenu:[1,2,3] and if I select one of the options, it sets the correct selection amount.

But on dataTable STARTUP it doesn't set the length to 1,2,3 but rather to the default '10'.

Which option am I missing?

max4ever · Accepted Answer · 2011-11-08 14:33:14Z

65

clear your cookies, the ones datatables saved when you were using bStateSave and you had 10,25,50,100

then refresh and it should now save 1 or 2 or 3

do you mean

"aLengthMenu": [[5, 10, 15, 25, 50, 100 , -1], [5, 10, 15, 25, 50, 100, "All"]],
"iDisplayLength" : 10,

answered Nov 8, 2011 at 14:33

max4ever

12.2k13 gold badges80 silver badges119 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sam Over a year ago

Thanks upfront, only changing aLengthMenu didn't have any effect today (didn't use bStateSave at that time), so i will try with iDisplayLength tomorrow. I will let you know and then vote/accept, thank you upfront!

Sam Over a year ago

Great, thank you. iDisplayLength is the Option for setting the initial Amount of Datarows to display. Thanks a lot!

Gyrocode.com · Accepted Answer · 2017-05-19 02:45:01Z

44

DataTables 1.10+

Use lengthMenu to define a list of available page lengths and optionally pageLength to set initial page length.

If pageLength is not specified, it will be automatically set to the first value given in array specified by lengthMenu.
```
var table = $('#example').DataTable({
   "lengthMenu": [ [2, 4, 8, -1], [2, 4, 8, "All"] ],
   "pageLength": 4
});
```
See this jsFiddle for code and demonstration.

DataTables 1.9

Use aLengthMenu to define a list of available page lengths and iDisplayLength to set initial page length.
```
var table = $('#example').dataTable({
   "aLengthMenu": [ [2, 4, 8, -1], [2, 4, 8, "All"] ],
   "iDisplayLength": 4,        
});
```
See this jsFiddle for code and demonstration.

edited May 19, 2017 at 2:45

answered Oct 7, 2015 at 3:37

Gyrocode.com

59k16 gold badges157 silver badges192 bronze badges

1 Comment

Sam Over a year ago

For DataTables below 1.10 please see the unaccepted answer This one is the more current version and therefore should be accepted now

Harshan Morawaka · Accepted Answer · 2017-09-27 06:53:42Z

1

Make sure to wait, until you angular things load.

$timeout(function(){ // given timeout for wait load the page
   $('#dataTables-example').dataTable({
        "iDisplayLength": 10, 
   });
}, 100, false);

answered Sep 27, 2017 at 6:53

Harshan Morawaka

7258 silver badges6 bronze badges

Collectives™ on Stack Overflow

jQuery DataTables Pagination Size

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related