We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Data disappears during InfiniteScrolling

Hi,

I am using a ej.grids.Grid with

pageSettings: { pageSize: 10 },
infiniteScrollSettings: { initialBlocks: 3 },
enableInfiniteScrolling: true,

and it all works.

When using the unversioned ej2.min.js (https://cdn.syncfusion.com/ej2/dist/ej2.min.js ), there is no problem when new data gets loaded due to the infinite scrolling.

When using the latest ej2.min.js (https://cdn.syncfusion.com/ej2/20.3.50/dist/ej2.min.js ) and I scroll to the end of the currently displayed data, all shown data disappears while the new data is being loaded. Only when the new data has been received, does the data show up again (the previous data and the new one). There is also no Spinner showing up while the new data is being requested.

I have attached two short videos showing the two behaviors.

I would appreciate it if you could have a look into this.

Thank you,

Daniel


Attachment: Archive_53e24ac2.zip

7 Replies

VB Vinitha Balasubramanian Syncfusion Team November 1, 2022 11:47 AM

Hi Daniel,


Greetings from Syncfusion support.


Currently, we are validating your reported problem with your shared information, and we will update you the details on 02rd Nov 2022. Until then we appreciate your patience.


Regards,

Vinitha Balasubramanian



VB Vinitha Balasubramanian Syncfusion Team November 3, 2022 01:02 PM

Hi Daniel,


Thanks for your patience.


We have validated the reported problem at our end, we want to convey We have provided the Loading Indicator support for the Grid from our Vol 3 main Release 20.3.47 version. Kindly refer the attached demos link and sample for your reference.


Demos: https://ej2.syncfusion.com/javascript/demos/#/bootstrap5/grid/loading-animation.html


Sample : https://stackblitz.com/edit/cy2lie?file=index.js,index.html


Please get back to us if you need further assistance.


Regards,

Vinitha Balasubramanian



DA Daniel November 4, 2022 02:20 AM

Hi Vinitha,


thank you for your response, I missed the change to have an option between a Spinner and Shimmer.

Your demo shows exactly the strange behavior as I mentioned.

  1. During the initial load of the data, there is no Spinner shown. (Though if I change your demo to Shimmer, the Shimmer is shown during the load.)If you click the 'load 100k data' button a second time, the Spinner is also shown.
  2. When scrolling to the end of the current dataset there is no Spinner shown during  the request to get more data. Instead a Shimmer is shown.
  3. If you click the 'load 100k data' a second time, the Spinner is also shown.
I have attached a quick screengrab to show that behavior - all with your provided demo. The only change I made is to increase the pagesize to 5,000 so that the process takes a bit longer and to set the Spinner.

Thank you,
Daniel

Attachment: Screen_Recording_20221104_at_08.04.30.mov_625f4c01.zip


VB Vinitha Balasubramanian Syncfusion Team November 7, 2022 11:18 AM

Hi Daniel,


Thanks for your update.


Currently, we are validating your reported problem with your shared information, and we will update you the details on 09th Nov 2022. Until then we appreciate your patience.


Regards,

Vinitha Balasubramanian



VB Vinitha Balasubramanian Syncfusion Team November 9, 2022 08:04 AM

Based on your update, we want to convey that by default “enableVirtualMaskRow” property is “true” in the Grid component on performing virtalScrolling and infiniteScrolling this the cause of the reported problem. We suggested to use enableVirtualMaskRow” property as “false” while performing virtalScrolling and infiniteScrolling. Kindly refer the code and sample for more information.


[index.js]

 

enableVirtualMaskRow: false,



sample : https://stackblitz.com/edit/cy2lie-3su6h4?file=index.js,index.html


If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.



DA Daniel November 16, 2022 03:24 PM

Hi Vinitha,


thank you for your reply.

enableVirtualMaskRow:false does indeed fix the issue with Spinner not showing when using infiniteScrolling - thank you for that!

It does not yet fix that the Spinner is not shown when loading the 100k in your stackblitz example.

(If you change it to 'Shimmer', then it does show while loading the 100k.)


Thank you,

Daniel



VB Vinitha Balasubramanian Syncfusion Team November 17, 2022 06:55 AM

We want to convey the below details to know more about the loading indicator feature.


  • The grid has an option to show a loading indicator in-between the time of fetching the data and binding it to the grid during initial rendering or refreshing or after performing any grid action.


  • We achieved by setting the loadingIndicator.indicatorType property to Spinner or Shimmer to set the loading indicator


  • In EJ2 Grid, the default value of the indicator type is “Spinner.”


Please refer the documentation for more information

Documentation : https://ej2.syncfusion.com/documentation/grid/loading-animation/


If we misunderstood your query, kindly share your exact requirement with detailed explanation.


Loader.
Live Chat Icon For mobile
Up arrow icon