Bug or feature request: scrollcolapse required to make bootstrap tabs work

WEHA

Recently I switched from jqueryui to bootstrap, and since then I'm experiencing the issue that when I use datatables in a tab with scroller on only the first 2 rows show.
I used the shown.bs.tab hook to enable datatable in tabs, but I did not see that scrollCollapse was enabled as well.
Though it's not mentioned in the explanation: https://datatables.net/examples/api/tabs_and_scrolling.html

When I enable this, everything works like a charm, only that I don't want scrollCollapse.
So my question is, is this a bug or should I request this feature to make it work without scrollCollapse?

Example: https://jsfiddle.net/_WEHA_/7h0brczk/9/
Here scrollCollapse is disabled so if you go to the second tab you'll see that only the first 2 of 57 entries is visible.
Setting scrollCollapse to true will make it work, but this is only interesting when the amount of lines sets the height to the desired setting.

Thanks!

colin

Hi @WEHA ,

It's because you've set

                "displayBuffer": 2,    // load n items for everscrool formula: (height / rowheight) * displayBuffer (default: 9)

If you remove that, everything works as expect.

Cheers,

Colin

WEHA

I see what's happening.. but it seems fixable to me that the predefined height in the options is used to calculate the displaybuffer instead of the elements at the time of init?

WEHA

Actually, this does not "fix" it at all, there's just more lines so it would seem fixed.
You can tell by the results info, line range is equal and does not show a range.
You can set the height higher, the same problem will occur

WEHA

I suppose I can't tag this as a bug myself? Unless I'm doing something else wrong and it isn't a bug

allan

I'm not 100% clear on the issue I'm afraid. If you remove the displayBuffer option like Colin suggested, does it not work for you?

Allan

WEHA

No, this just makes the initial list longer.
I've updated the example for your convenience, just scroll down in the datatable and you'll see that it's bugged.

colin

You'll need to link to the example.

WEHA

You mean the one in the original post?

WEHA

Seems I did not see the version tag at the end in the url (I'm new at jsfiddle)
Link: https://jsfiddle.net/_WEHA_/7h0brczk/13/

allan

Thank you!

I've made a couple of changes:

1. Removed jQuery and DataTables includes from the HTML section of JSFiddle since they were already in the resources. That was causing part of the issue.
2. Add a call to scroller.measure() after doing the column resizing for exactly the same reason.
3. Add table table-striped table-bordered as the class for the table to get a Bootstrap styled table.

Allan

WEHA

Excellent, scroller.measure() fixed it for me.
Maybe add this to the documentation on https://datatables.net/examples/api/tabs_and_scrolling.html if scroller is used?

Thanks!

nickpapoutsis

Can confirm, scroller.measure() fixed the same issue for me.