I am facing a problem that the page will be scrolled automatically.
This problem will occur at the occasion that Grid is in batch editing mode(editable: true) and keyboard navigation is active(navigatable: true).
When I focusing a cell, and then trying to lost focus by pressing enter key or tab key,
the gird will be scrolled to the top of the page.
This behavior is not friendly for my users since they have to find the cell when the edit finished,
but the keyboard navigation is very useful for them (such as pressing tab key to jump to the next cell).
So is there any way to prevent page scrolling without disabling keyboard navigation function?
I have created a sample to reproduce this behavior in attachment.
You can open the file located in <./demo/grid/editing-custom(preventScrolling).html> to check it.
5 Answers, 1 is accepted
The behavior is expected, because the current dataSource has it's autoSync property set to true. This means that after each change the Grid table is redrawn with the new data, meaning that the previous cell will not exist there anymore. A sample solution would be use the save event to store the index of the last edited cell and then use the dataBound event handler to set it as active again using the current method of the Grid API. Here is an example that demonstrates the approach.Regards,
Thank you for your reply.
I think you may misunderstand me by my poor English.
The behavior what I want is that when a edit is finished on a cell, the page will be not scrolled -- the position of the grid in the window will not be changed.
In my sample, when I finished edit by pressing tab or enter key, the position of grid will be moved to the top of the window even I set the autoSync property to false.
Is there any way to keep the position of the grid in the window?
I am unable to reproduce movement of the Grid on the page. Could you elaborate in which browser is the behavior observed? If possible please send us small screencast to demonstrate the issue.Regards,
Thank you for your reply.
The browser I used is Chrome(v43.0.2347.132m).
I noticed that the problem can not be reproduced in IE11.
I reproduced this problem by Chrome and took the screen cast.Please check it in attachment files.
The mentioned behavior is expected. When the editing is finished, the focus of the page goes to the Grid table element, which the browser tries to scroll into view in order to make it visible. This is why it scrolls either to the first row or to the top of the page if the first row is currently not visible. The custom solution would be to store the Grid scroll position and then restore it when needed, but the implementation would be tricky as the user may scroll before or during the editing.Regards,