maintaining scroll bar position using javascript/jquery (jqgrid)

Question

I have a problem with regards to maintaining the scroll position of my jqgrid .

Here is the objective of my program:

1. First, I click on the row.
2. After clicking on the row, a form will pop-up.
3. After updating record, the user will then close the form.
4. The jqgrid will reload.
5. After the jqgrid reloads, it will select the "last selected item"

I have no problem with these steps (1-5)

My problem is that if I have extensive rows for example 500 rows. It will display the scroll bars on the side of the jgrid.

What I want to do is to maintain the scroll position of the scroll bars using Javascript or jQuery. How do I do this?

I tried to use this, on loadcomplete event

var scrollPosition = 0;
                scrollPosition = jQuery("#jqgrid").closest(".ui-jqgrid-bdiv").scrollTop(scrollPosition);
                jQuery("#jqgrid").closest(".ui-jqgrid-bdiv").scrollTop(scrollPosition);

but it doest give me the value of the scroll position

Answer 1

See . this fidle based on this article

<input type="submit" id="button"/>
<div id="div1"> </div>


$("#button").click(function() {
 $('html, body').animate({
              scrollTop: $("#div1").offset().top
 }, 2000);
 });