Lazy Query Container: Table Row Height and Scrollbar size issue

I am using Lazy Query Container to display table data lazily. My table can have millions of rows. The height of each row varies and it can be 500 px, 600 px, 100 px or whatever.

I am setting container size correctly to be whatever rows are there in database.

But when the height of each table row is different from stand table row height (I guess 29 px) then the scroll bar is not calculated and positioned based on millions of rows and it displays as if there are few 100s of rows in table. And when you scroll down, it keeps calculating and keep updating itself for more and more rows to show up.

I do not see this issue when I use standard row height, in that case the scrollbar position and height etc is correct and I can scroll from 1st row to millionth row correctly.

How this can be fixed?

The table component does not support rows of different sizes.
It basically do a (number of rows)*(height of row) to know the height of the table.

To have the table know the actual height of all rows, it would require loading all the table rows at once (so no lazy loading).

So your options are to :

  • use a fixed size for each row this might not be possible depending on your content
  • load the whole table at once (set page length to the table length and wrap into a Panel) which seems to be a really bad idea seeing the size of your data
  • use a paged table, it’s not as smooth as the table but you can load one whole page at once and so have the correct scrollbar length for each page
  • use a technique I am not aware of