Prevent scroll when grid dataSource is updated

[Hiba]

Hello Syncfusion Team,

When I scroll to the right for example and then I update the grid datasource, currently the scroll automatically moves to the left.

I want the scroll to stay in the same position as it was before updating the dataSource.

The solution I tried is to save the scrollLeft position before the update and then in dataBound I move it back.

But then the user sees the scroll "dancing", going left and then back to the right side and it's annoying.

Is there a way to keep the scroll position the same, before and after the dataSource update without having the user see it moving?

Thanks in advance for you help

[Thiyagu Subramani]

Hi Hiba, 

Thanks for contacting Syncfusion forum. 

By default, in EJ2 Grid, we used the scrollbar of the browser to scroll the contents in the grid, and if we change the dataSource of the grid, the gird will automatically refresh the contents so that the scroller moves to the left of the contents.  

Based on your reported information we have prepared a sample as per your requirement. But in our sample your reported issue doesn’t reproduced at our end. please refer to the below sample. 

Sample link :  https://stackblitz.com/edit/angular-pkifwy-bjgina?file=app.component.html 

If you still facing the issue, please share the below details. 

1. Share your issue reproducing sample (or) reproduce the issue is above sample.
2. Share video demonstration of your issue.

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

Regards, 

Thiyagu S. 

1

[Hiba]

Thank you for your reply..

The problem appears when the new updated data has a new column and I must call refreshColumns()

I hope you can find me a solution

[Thiyagu Subramani]

Hi Hiba, 

Thanks for your update. 

We have prepared a sample as per requirement “When the new updated data has a new column” and we have reproduced your reported issue “Scroller moves left to right” at our end also.  

By default, in EJ2 Grid, we have used browser scrollbar to scroll the contents in the grid. If we change the dataSource of the grid, the gird will automatically refresh the contents. So that, the scroller moves to the origin(left) of the scrollbar. Basically scrollbar rendered in grid after data bounded and based on grid’s width and height. 

  

In this below sample after dataSource update, we have defined stored scroll left position to grid content using button click event and its same time grid refreshes the contents automatically and moves scroller to the origin. This both actions performs in fraction of time periods so only your reported problem occurred. We cannot prevent this and Its default behavior of current grid architecture. 

Sample link : https://stackblitz.com/edit/angular-pkifwy-ycdnmu?file=app.component.ts 

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

Regards, 

Thiyagu S. 

[mingwang wang]

In ASP.NET Framework 4.8 JavaScript, I freeze first 2 columns, has both horizontal scrollbar and vertical scrollbar. First scroll horizontal scrollbar to far right end (the last column), then scroll vertical scrollbar, now grid auto scroll to 3rd column, but  horizontal scrollbar still show at the far right end. how to fix? Thanks!

[Rajapandiyan Settu]

Hi Mingwang,

Thanks for contacting Syncfusion support.

Kindly share the below details to validate the reported behavior at our end.

1. Share the complete Grid code file (index.cshtml).
2. Share the Syncfusion DLL version and script version.
3. Video demo of the reported problem.

Regards,

Rajapandiyan S