no server side scroll if table not visible in init
Closed this issue · 9 comments
If I use tab control in page and the initialize datatables with scroll and not visible, the data.length is NaN on the server side.
line 920 : this.s.heights.row = $('tr', tbody).eq(1).outerHeight();and this line return 0
and divide by zero
line 409 : this.s.viewportRows = parseInt( heights.viewport / heights.row, 10 )+1;and return the ajax length to NaN
I also experienced the same issue. Reverting to 1.2.0 solved this issue for me.
I've just been looking into this a bit more. When Scroller is activated it calculated the height of the table rows to it can perform its positional calculations. However, if you initialise it in a hidden element, then there is no height that can be calculated!
I've replicated this in a little test case here:
Note that the table appears to be empty (it does actually have data, as do your own, but because the row height is 0, you can't see it!).
The fix is to have Scroller calculate the row height when the tab is made visible. The row height in Scroller can be recalculated through use of the scroller().measure() API method that Scroller adds to the DataTables API. My little test case shows the problem being resolved using that method here:
I've recently come up with an idea for how this requirement to call an API method can be resolved. There are details on a recent blog post here:
The only downside that I can see at the moment is that IE requires a solid background colour for the table using that method. Otherwise it paints a border around the table that simply cannot be removed...
Any news here? I have the same problem. Evenscroller().measure() doesn't work. Scroller causes oSettings._iDisplayLength to be NaN so I cannot even fetch correct portion of data from my backend. Any idea how to solve it?
scroller().measure() should work when the table is visible. If is doesn't please open a support thread with a link to a test case showing the issue so it can be debugged.
OK, so the question is why it worked in 1.2.0 and doesn't work in 1.2.2 (I mean without scroller().measure)
When I used _fnCalcRowHeight method body from 1.2.0 in 1.2.2 things seem to work fine. Do you have any explanation for this?
Can you link to a test case showing the issue so I can debug it please. That way I might be able to explain and correct the issue.
More precisely the problem is in small difference
In 1.2.0 _fnCalcRowHeight had something like that in code:
container.appendTo( 'body' );
1.2.2 has:
container.appendTo( appendTo );
And this part seems to be causing problems.
Fixed in 43ddcf4 (I forgot to reference this bug in the commit message).
If the table is hidden it will now insert into the body like 1.2.0 did. It isn't perfect, but it will help with the majority of cases!