as you can see from this jsFiddle the "top" value provided from the "ScrollVertical" event callback is different each time you scroll down until the end of the scrollbar.
I am trying to build a "virtual scrolling" behaviour, but Tabulator doesn't give to me the correct scroll position.
const table = new Tabulator("#example-table", {
height:"300px",
layout: 'fitColumns',
data: data, // a some-hundreds long list of objects...
rowHeight: 40,
columns:[
{title:"Name", field:"name"},
{title:"Surname", field:"surname"},
],
});
table.on('scrollVertical', (top, dir) => {
const dirStr = dir ? 'up' : 'down';
console.log('scrollVertical', dirStr, top);
});
"virtual scrolling" is for me a form of "pagination":
- I ask to the server the number of table rows (e.g. it responds: 1000);
- I fill the table with that number (1000) of empty rows, so the scrollbar is enabled;
- User moves the scroll-bar to the middle of the table;
- I am subscribed to the "ScrollVertical" event, so I get the "top" position (now is not reliable!) (I can easily calculate the scroll handle is, in my example, at the 50%)
- I ask to the server the rows I need (e.g.: from 480 to 520)
- I use Tabulator function to replace the relative empty rows (480..520) with the ones retrieved.
But... The "top" value of the "ScrollVertical" event callback is not reliable at the moment :(
Does someone faced (and solved) the same issue?
I opened a bug to Tabulator team: