Lazy loading with virtual scroll on p-table

boiche commented 1 year ago

Describe the bug

Prerequisites:

data source of 1000 records
p-table with
1. scroll height: 761px
2. rows: 30
3. virtualScrollItemSize: 40
4. virtualScroll: true
5. virtualScrollDelay: 0
child component that is reachable through a button. The child component must be able to navigate back to the grid.

Lazy loading is triggered only when reaching the beginnig of next chunk of data. When scrolled via primeng/table/Table's method 'scrollToVirtualIndex(index: number): void' upwards data is not loaded when scrolling through previous chunk of data. Loads it when reaching the beginning of current chunk.

Environment

Windows 11, Visual Studio Community 2022, Angular template project,

Reproducer

https://stackblitz.com/edit/ntutb5?file=src%2Fapp%2Fdemo%2Ftable-virtual-scroll-lazy-demo.html

Angular version

15.2.0

PrimeNG version

15.4.1

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

16.17.1

Browser(s)

Chrome

Steps to reproduce the behavior

Steps to reproduce: Scroll to random record index (e.g. 250). Navigate to child component. Navigate back to the grid (not by popstate). Via primeng/table/Table's method 'scrollToVirtualIndex(index: number): void' try to scroll to the recent reached index (e.g. 250) Try to scroll upwards.

Expected behavior

Expected result: data is loaded normally

Comment: lazy loading should be able to trigger onLazyLoad event when reaching new chunk either from top or bottom. No data is loaded above the yellow chunk. What is expected is onLazyLoad to be triggered right before reaching the bottom of the chunk above (as it works for bottom chunks). virtual_scroll_with_lazy_load

SaajRP commented 1 year ago

This is still an issue on PrimeNg 16.2.0

Virtual Scroll, Lazy Load, rows has been set to a given number
Scroll from the top of the table to the bottom, then scroll to the middle
The middle of the table will be stuck in a loading state indefinitely

A work around I’ve found it not setting the rows, however, this will cause another set of issues, such as

https://github.com/primefaces/primeng/issues/13517

SaajRP commented 10 months ago

This remains a problem as of PrimeNg 16.9.0

SaajRP commented 10 months ago

Remains problems as of PrimeNg 17.0.0

SaajRP commented 8 months ago

Remains a problem as of PrimeNg 17.2.0

SaajRP commented 6 months ago

Remains a problem as of PrimeNg 17.10.0

SaajRP commented 6 months ago

Remains a problem as of PrimeNg 17.12.0

SaajRP commented 6 months ago

@cetincakiroglu would it be possible for someone from the PrimeNg team to have a look at this, as it has remained an issue for almost a year

SaajRP commented 1 month ago

Remains a problem as of PrimeNg 17.8.7

@cetincakiroglu @mehmetcetin01140, would someone please have a look at this, it has been an issue for over a year, and makes virtual scrolling, lazy load tables with a row attribute defined, unusable in practice

SaajRP commented 1 month ago

Stackblitz instance for testing: https://stackblitz.com/edit/oetsny-rdsoxe

primefaces / primeng