Skip to content

Infragistics Community Forum / Web / Ignite UI for Angular / IgxGrid Angular – Set scroll location using API

IgxGrid Angular – Set scroll location using API

New Discussion
Srihare Ravindran
Srihare Ravindran asked on Nov 18, 2020 12:43 PM

Hi,

I am trying to set the scroll location (basically go to top of grid) after some action is done. The grid in question is using virtualization and the data is fetched and set using the onDataPreLoad.

In a particular scenario, I would like the grid to scroll back to the top (index 0). I tried a couple ways of doing this, but none of them seem to be working.

  1. Using the navigateTo method in IgxGridComponent
  2. Setting the verticalScrollContainer.scrollPosition value to 0 (and even doing a refresh grid / reflow / cdr.detectChanges)
  3. Using the scrollTo method in the verticalScrollContainer

Is there a better way to set the vertical scroll location ?

Little more description is that I am having a 10000 row data, showing around 20 of them at a time. When an action happens, I kind of change the layout of the grid (adding / removing some columns and changing the format of the data). When this happens, the scroll position is being retained and that is causing an issue when the next onDataPreLoad runs.

Sign In to post a reply

Replies

  • 0
    Martin Evtimov
    Martin Evtimov answered on Nov 18, 2020 12:43 PM

    Hello Srihare,

    Thank you for contacting Infragistics Community!

    I believe you will find the following sample I have prepared for you very helpful. As you can observe it is using remoteDataOperations and subscribing to the onDataPreload it fetches the data. Further, you will notice that when scrolling down the grid and the virtualizationState.startIndex gets bigger than 7 one of the grid columns gets hidden. After scrolling back so that the virtualizationState.startIndex gets equal or less than 7 the column gets visible again. The same happens if the user clicks on the Navigate Top button, which is bind to the igxGrid navigateTo method. As you can observe everything is working as expected.

    If this sample is not an accurate demonstration of what you are trying to achieve please feel free to modify it so that it replicates the issue you’re facing and send it back to me for further investigation.

    Looking forward to hearing from you.

    Best Regards,
    Martin Evtimov
    Entry Level Software Developer
    Infragistics, Inc.

  • You must be logged in to reply to this topic.
Discussion created by
Favorites
Replies
Created On
Last Post
Discussion created by
Srihare Ravindran
Favorites
0
Replies
1
Created On
Nov 18, 2020
Last Post
5 years, 3 months ago

Suggested Discussions

Created by

Created on

Nov 18, 2020 12:43 PM

Last activity on

Feb 23, 2026 8:28 AM