Page resize and server side processing initial draw

rroliee

I think there is a bug in datatable, or page resize plugin somewhere, when using server side processing and page resize together.
You can see it in this demo too. (https://coderexample.com/demo/datatable-page-resize/)
On the initial load page info shows 12 rows, but actually ther is only 10 rows in the table.
The first event that recalculates the row number or ends in an ajax call corrests this.
Could you please give a solution for this?

bindrid

have you looked at the numbers in both what is sent to the server and what is returned from the server? Those are the numbers that are used to calculate the numbers you see at the bottom.

colin

I'm looking into this one - the server is correctly responding to what was requested. The problem is that it initially requested 10 rows, trying to determine what/why that's happening.

Will report back in a bit...

C

colin

Yep, think I'd agree with that there's most likely a bug in there... I've simplified your already very simple example (thanks for that), http://live.datatables.net/qivehezu/1/edit , and here it resizes to smaller after the first draw. I think it starts at the default page size of 10 for that initial request, then gets smart afterwards and resizes. I'll get a second opinion on it, but suspect it'll need a fix.

C

rroliee

I've managed to create a workaround by calling
setTimeout( function(){
myTable.ajax.reload().draw();
}, 0 );
in the 'init.dt' event handler.
It redraws the table with the correct page size.

The page size was set correctly before but even if I called reload in 'init.dt' it had no effect. It worked only after 'init.dt'.

In between can you tell me what is the difference between .ajax.reload().draw() and simple .draw() when using server side processing?
Which one is better? I use .ajax.reload() because I need to define a callback in reload.

colin

Hi @rroliee ,

That sounds like a good workaround, the user wouldn't be aware of it. I've raised the issue as a bug so I'll let you know when it gets progressed.

Regarding the differences in the two draw functions: draw() just redraws the page with the data that's already present, and ajax.reload() gets the new data. The api allows commands to be chained together (since most return a DataTables.Api object, so ajax.reload().draw() chains the two together - it gets the new data, then draws it!

Hope that helps,

Cheers,

Colin

swartjie

This bug is still present it seems , where should I add the above workaround to get it working though?

colin

@rroliee suggested in the init handler, so that'll be the place.

bluecandy101

This bug is still present it seems. When will it be fixed?

colin

Yep, agreed, our ticket (DD-89 for my reference) is still open. We'll take a look and report back,

Colin

allan

I've just committed a small change to the PageResize plug-in which allows this to work as expected using DataTables' preInit event. You can tweak a local copy of the PageResize plug-in to have that change (we don't have nightly builds of the plug-ins I'm afraid).

There are two conditions for this to work:

1. Needs DataTables 1.10.8 or newer (ideally the current release, which is 1.10.24 at the time of writing)
2. You must have a row in the table's tbody when it is initialised. This is to allow the plug-in to work out the height of the rows. Since it is server-side processing the row will be thrown away so in the example I was working on I used:

                    <tbody>
                        <tr>
                            <th colspan="6">Loading...</th>
                        </tr>
                    </tbody>

Allan