ejs grid is not filtering with virtualization

[Visha Shah]

Hi,

I am using Angular ejs grid. The below example does not work if virtualization in enabled. It adds the filtered row at the end of the grid. 

In my app, it has the same behavior. 

https://stackblitz.com/edit/angular-syncfusiongrid-date-filter-nc7a1q?file=package.json

I have another example, which works fine. I do not know why. The ej2-angular-grids package is same for both examples. 

https://stackblitz.com/edit/angular-j1ssch?file=package.json

Can you please let me know what am I doing wrong in first example? Our app has the same packages as this and does the same thing (adding a new row when we filter)

Regards,

Visha Shah

[Thiyagu Subramani]

Hi Visha, 

Thanks for contacting Syncfusion support. 

Based on your shared information we suspect the your reported issue may occurs while missed to inject VirtualScrollService and content height in the Grid. 

By default virtualization in Grid allows you to load large amount of data without performance degradation. To use virtualization, you need to inject VirtualScrollService in Grid. 

Row virtualization allows you to load and render rows only in content viewport. It is an alternative way of paging in which the data will load while scrolling vertically. To setup the row virtualization, you need to define enableVirtualization as true and content height by height property.  

The number of records displayed in the Grid is determined implicitly by height of content area. In this you also have an option to define visible number of records by pageSettings.pageSize property. The loaded data will be cached and reused when it is needed for next time. 

To achieve this requirement we suggest to inject VirtualScrollService and height to the Grid. Please refer to the below modified samples for more reference. 

Sample link:  https://stackblitz.com/edit/angular-syncfusiongrid-date-filter-wrgw4x?file=src%2Fapp%2Fapp.component.html 

                    : https://stackblitz.com/edit/angular-j1ssch-pnbtna?file=app.component.html 

UG: https://ej2.syncfusion.com/angular/documentation/grid/virtual/ 

Module injection: https://ej2.syncfusion.com/angular/documentation/grid/getting-started/#module-injection 

                             : https://ej2.syncfusion.com/angular/documentation/grid/module/ 

Please get back to us, if you need any further assistance. 

Regards, 

Thiyagu S 

[Visha Shah]

The fix worked great! 

Thank you! 

[Thiyagu Subramani]

Hi Visha, 

Thanks for your update. 

We are happy to hear that the provided solution works at your end. 

Please get back to us, if you need any further assistance. 

Regards, 

Thiyagu S