I am also having an issue with this in FireFox 3.5 and IE 6,7 using jqGrid 3.5.3.

If you have a grid with enough rows to make the window scroll and you click into an editable field, the grid automatically scrolls up to the point where the editable row is now at the bottom of your window.

Here's my testing setup. Very basic just to recreate this issue:

Hi Tony,

I added the DOCTYPE declaration but the issue still happens.

Thanks

Derek

Hello,

Not sure if this is applicable solution, but if this works for you

Regards

Tony

If I comment out that line, the page scrolling/jumping is fixed. The escape and enter keys still work. However, the left, right, up, and down arrow keys no longer work for the grid and the user is forced to use their mouse to navigate the cells from then on. My users are utilizing the arrow keys when working with my grid.

So, we are close but I need a way to fix this issue without eliminating the arrow keys for cell navigation.

Here's a solution that is working for me:

At line 346 of grid.celledit.js:

var selection = $(“<span…

Add “position:fixed;top:0px;left:0px” to the style attribute of the outer span.

The inner span is the element which responds to the up/down/left/right keyboard events and moves the selected cell. To do this, it needs to have the focus. When it is given the focus, FF and IE scroll the browser, if necessary, so that it is visible. If you are editing a long grid, the browser may scroll up since the hidden span is inserted at the top of the grid. My proposed solution fixes the span to the viewport so that it's always “visible”, and the browser doesn't have to scroll.

pkane's solution is working for me, too. Is there any chance this will make it into a future release? Alternatively, putting that outer span's style into the CSS would allow those of us who need this fix to implement it in CSS rather than patching the source.