Scroller pagination issue: offset always 0
Scroller pagination issue: offset always 0
tacman1123
Posts: 181Questions: 41Answers: 1
Scroller pagination has always bit a bit of a mystery to me. I'd like to be able to configure that page size, it appears to guess the page size based on some hueristic.
Regardless, that's not really my problem. When scrolling through
it works fine, you can see in the console that the offset changes.
But when selecting Symfony 7 and marking=valid
https://packages.survos.com/?marking=valid&symfonyVersions=7.0 (alas, due to an unrelated but, query string parameters aren't auto-selecting the facets, so to see the error you have to open the searchPanes and select these 2).
Now scroll through, and and the debug line shows the offset as always 0, so it never gets beyond 135.
I think this use to work, but may not. It seems to work without the facet searches, so maybe I'm encoding something wrong? Or maybe related to the sort?
Answers
I made a 45-second video to show the problem: https://www.awesomescreenshot.com/video/26297260?key=16f4eaa82bba8a918a37d2a83cb61fd1
Hi,
Thanks for the link and video.
The number of rows that Scroller selects to get and display is based on
scroller.displayBuffer. That is basically the number of rows that fit into the viewport multiplied by that fixed factor.This is the code that does that.
Regarding the offset, I'll need to come back to that. I'm traveling this week, so it will probably be next week before I get a chance to have proper look at it.
Allan
Thanks -- that explains why when I open the console debugger the number of rows requested changes!
I'm still stuck on the offset, I'd be grateful if you got a chance to look at it. Thanks.
Perhaps there's a version out of sync, I found this when trying to upgrade everything.
Hi, any suggestions on where I can look to solve this?
That doesn't make a particularly huge amount of sense to me. 2.0.3 should be included in that range I thought. I understood it to be 1.11.* through 2.*.
Checking with the npm SemVer Calculator appears to confirm this:
What package manager are you using?
Allan
AssetMapper (from Symfony) which downloads the packages from jsdelivr.
I believe it then scans the downloaded package for dependencies and installs those.
But I'm not sure the problem is the packages, but rather that the callback isn't providing the right offset. Maybe it's a package sync issue, but that might be completely unrelated.
I've added an issue to get rid of the warning in AssetMapper, but I'm almost positive that it's simply a false warning, and not the root of the pagination problem.
https://github.com/symfony/symfony/issues/54610
Are you able to confirm this behavior? I'm stuck on where to even look at this point. I'm wondering if it's something new in version 2, as I think this same code use to work.
Apologies - I was focusing not on the offset issue, but rather the version error. That might well be something in symfony that has different semver handling that node - I'm not sure.
But going back to the offset issue - it looks like you have different row heights in the table, and that isn't valid with Scroller. With Scroller you must have all rows exactly the same height, otherwise it can't perform its virtual scrolling calculations (i.e. it can't say "row x must be exactly at pixel position y, since all rows as height z" and it can't calculate the height of all rows, since 1, it doesn't have all the rows and 2 that would be so slow).
Try adding the
nowrapclass to your DataTable. That will help in that regard (although you'll have thedescriptioncolumn hidden by Responsive I'm afraid).I'm not certain that will fix it outright, but it might...
Allan
Indeed, that solves the problem, thanks!
Is there a way to simply lock the row height? I can control the image size (though the images are loaded later, obviously, and that's probably contributing to the mis-calculation of the height).
That is, if I have to lock the height of the row, it should be the maximum height of the thumbnail image. Then I'd like description to simply wrap to the available height and show an ellipsis if it doesn't have the space.
I'm not seeing a thumbnail on the page I'm afraid? However, if you have an
<img>tag, adding the correctheightandwidthattributes will allow it to render in the space correctly.One other thing I've realised - the use of the child rows is going to mess up Scroller as well, since that also takes up vertical space in the scrolling container.
You could use a modal? Or if you only have 1000 rows, I wouldn't bother using Scroller. It if was 10k, then sure, it makes more sense (although paging might work for you instead of scrolling?).
Allan