Next Button not working - PageLength not getting set by default

ad824a

Hi Everyone,

I am having an issue with the next button not working for my table. I have determined it is most likely due to the pageLength not being set properly when the table is loaded, but I am not exactly sure how to fix it. In my configuration I have paging: true, pagelengh: 10, and lengthmenu: [[ 10, 25, 50, -1 ], [10, 25, 50, "All"]] (I will link a test case)

I have updated the CSS to highlight buttons that are active. When the table loads, none of the length menu buttons are activated:

I can manually open the menu and select a pagelength and the Next button will work:

Why is the 10 option not being set automatically by pagelength:10 ?

Here is my test case: live.datatables.net/ginakowo/1/

The configuration for my table is built into the test case... but the buttons aren't being displayed. I tried including the Buttons Library but that just introduced an error at line 0. I assume I just don't know how to use JS Bin, but hopefully it is enough for someone to go on.

Thanks!

allan

I've just made a few tweaks to your example to load in the required files (Buttons after DataTables, JSZip for Excel, ColVis and the HTML5 buttons). It appears to work as expected now: http://live.datatables.net/ginakowo/2/edit

Can you confirm if it is working for you?

Allan

ad824a

Hm ok so now it works in test but not in my application. I showed that I am using state save/load but I removed the actual code for simplicity. Is it possible that the state could override pagelength somehow?

ad824a

Ive added the code to the examplelive.datatables.net/moyinapo/1/

allan

It is possible. Can you show me the JSON that you are passing to the callback function in the stateLoadCallback please? e.g. console.log(JSON.stringify(Data))?

Thanks,
Allan

ad824a

Oh that has to be it. Length is a string and that causes problems, right?

ad824a

I updated Data.length to an integer which selected the right menu option when the table loaded

But now I get this error when I click the next button: jquery.dataTables.min.js:43 Uncaught TypeError: Cannot read property 'nTr' of undefined

So Im not sure if converting to an int is the solution

colin

Could you update that test case with your most recent code, please, so we're all looking at the same thing.

Colin

ad824a

The new line is line 45

live.datatables.net/moyinapo/2/

ad824a

And here is a screenshot showing the length is an int

ad824a

Ok so here is what I have found.

When there is no state to be loaded (Data = ''; on line 54) the Next button works fine. When there is a state to load, the button does not work.

As soon as there is a state saved and Data is loaded into the table, the button fails.
Just to test, I tried using delete Data.length but I still get the Cannot read property 'nTr' of undefined error.

Any idea how to work around this?

colin

It would help if we could see this, the code doesn't run, so it makes it hard to debug. Could you link to your page so we can see it there, please, or tweak the test case so it demonstrates the error?

Colin

ad824a

Sorry everyone, Ive been pulled away from this issue for the time being. When I get some free time at work, I will try to get a full test case going, but for now I've just made the Previous/Next buttons invisible.