Primeng: Filtering and sorting with virtual scroll and lazy mode in table is not working within dialog

[mnhock]

I'm submitting a ... (check one with "x")

[x] bug report => Search github for a similar issue or PR before submitting
[ ] feature request => Please check if request is not on the roadmap already https://github.com/primefaces/primeng/wiki/Roadmap
[ ] support request => Please do not submit support request here, instead see http://forum.primefaces.org/viewforum.php?f=35

Plunkr Case (Bug Reports)
Please demonstrate your case at stackblitz by using the issue template below. Issues without a test case have much less possibility to be reviewd in detail and assisted.

https://stackblitz.com/github/primefaces/primeng-issue-template

Current behavior
Filtering and sorting in table with lazy and virtual scrolling is not working. The problem is that when the data is initialized in ngOnInit() the array size is not correct and/or should be re-initialized. The old totalrecords property is not working anymore in order to handling the array propertly as before. The problem is when you use this feature within a dialog.

Expected behavior
Filtering and sorting should work in lazy and virtual scroll mode and the array with the data should be handled correctly through the total records property.

Minimal reproduction of the problem with instructions
Table (lazy load, virtual scroll) within dialog and sorting and filtering enabled.

What is the motivation / use case for changing the behavior?

Please tell us about your environment:

• Angular version: 10.X
  

• PrimeNG version: 10.X
  

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]
  

• Language: [all | TypeScript X.X | ES6/7 | ES5]

• Node (for AoT issues): node --version =

[188599]

Here's a sample of the issue:

https://stackblitz.com/edit/github-nth8qc?file=src/app/app.component.ts

It works fine without the [lazy]="true" directive.

[lilacdev]

This issue should be renamed as "Filtering and sorting with virtual scroll in table does not work at all" . I spent one week trying to make it work (in both p-table or in VirtualScoller), never achieved it :/ .
By the way, in documentation, sorting is made client side. This is quite useless : if we use lazy loading, this is because sorting is made server side.

[brian428]

I see the related issue #9296 was closed as a duplicate. I just wanted to call out the fact that the virtual scrolling doesn't work in a Dialog, whether or not lazy loading is also being used. Bug demo: https://stackblitz.com/edit/primeng-tablevirtualscroll-demo-jgsrhz?file=src/app/app.component.html

Also worth noting that this is not a sizing issue. In other words, the problem isn't that p-datatable-virtual-scrollable-body has rows in it that can't be seen. There are no data rows output to the DOM at all.

[andybastian]

Hi, i am facing the same problem in one of our apps. Until version 9.0.6 the component an it's settings works properly. The problem seems to happen since the reimplementation of the table component in version 9.1.0 Are there any updates or known workarounds for this problem?

[mnhock]

Here are any news? Unfortunately, the same problem occurs still with the latest version 11.2.1.

[yigitfindikli]

If you using lazy mode you need to do filter and sort on your side. Example: https://primefaces.org/primeng/showcase/#/table/lazy