How to set Browser Scroll Bar position in ASP.Net<br>


Home \| FAQ \| About \| Contact \| View Source

SEARCH:

BROWSE:

My Hood

CONTRIBUTE:

Home > Messages > ASP.NET > How to set Browser Scroll Bar position in ASP.Net

Add to MyHood

Author

Subject: How to set Browser Scroll Bar position in ASP.Net

Subscribe to this thread

Deepak Kishore

9/3/2003 2:21:13 AM

Not rated

Hi,

I've a web form. In this I have scroll bar. It's scrolled down and in this position form is posted back. When it's posted back, the scroll position is not same. It's at the begining of the page. My requirement is I want to set the scroll position to the same position where it was before.

thanks,

Deee

[Top] [Bottom] [Listen] [Edit] [Reply]

Jason Kennedy

9/3/2003 8:52:30 PM

Not rated

the only way i know of to attempt this in ASP.NET is to use the SmartNavigation property, but this method will only work if the user is using IE5 or above. Alternatively you can script a client-side solution that will check the position of the page before the page postback is called, and then reset the page position after the page reloads. In javascript, you can use these properties to get the scroll position of the page:

in Internet Explorer:
document.body.scrollLeft
document.body.scrollTop

in Netscape:
window.pageXOffset
window.pageYOffset

You can then pass those values along in hidden form fields and use the following javascript routine to scroll the page back to where it was before the postback:

window.scrollTo(document.Form1.PageX.value, document.Form1.PageY.value);

I tried this and it works nicely... Here is the code that I used:

<HTML>
<body onload="javascript:ScrollIt()" onscroll="javascript:setcoords()">
  <form id="Form1" method="post" runat="server">
    ...Page Content...
    <input type=hidden id=PageX name=PageX value=0 runat=server>
    <input type=hidden id=PageY name=PageY value=0 runat=server>
  </form>
<script language=javascript>
function ScrollIt(){
    window.scrollTo(document.Form1.PageX.value, document.Form1.PageY.value);
    }
function setcoords(){
    var myPageX;
    var myPageY;
    if (document.all){
        myPageX = document.body.scrollLeft;
        myPageY = document.body.scrollTop;
        }
    else{
        myPageX = window.pageXOffset;
        myPageY = window.pageYOffset;
        }
    document.Form1.PageX.value = myPageX;
    document.Form1.PageY.value = myPageY;
    }
</script>
  </body>
</HTML>

As long as the ViewState is enabled, the hidden form fields will be updated on the postback with the new page coordinates so that the javascript routine will have valid values to use to perform the scrolling.

Hope this helps

[Top] [Bottom] [Listen] [Edit] [Reply]

Rajeev Nair

9/5/2003 5:08:42 AM

Not rated

Thank you very much. It worked.

Thanks again

Deee

[Top] [Bottom] [Listen] [Edit] [Reply]

Jason Kennedy

11/14/2003 10:19:45 AM

Not rated

If anyone is interested, someone emailed me awhile back about this solution not working for Safari browsers. After a little bit of researched, I learned that Safari does not support the javascript onscroll event, so if you need to support a wide variety of browsers, you may want to look into using additional events such as onMouseDown and onClick along with the onScroll to try to cover other browsers.

[Top] [Bottom] [Listen] [Edit] [Reply]

Jeffrey Ting

12/8/2003 11:32:08 PM

Not rated

Thank you for this submittion.

[Top] [Bottom] [Listen] [Edit] [Reply]

d s

12/16/2003 1:02:47 PM

Not rated

There is a nice third party control that is free that handles this rather nicely however it is not a total replacement for SmartNavigation. Smartnavigation does a great job hiding a lot of page refrsh issues. This control simply maintains X/y scroll position between postbacks you can find it here

http://www.strengthtechnologies.com/scroll/

[Top] [Bottom] [Listen] [Edit] [Reply]

Heidi Hundåla

1/8/2004 10:11:03 AM

Not rated

My .Net web app is supposed to fit every browser, and the smartNavigation works fine in
IE 5 plus, but not in other browsers. I've tried different javascript solutions, but when I press one of
the buttons which submits to the server, the scroll pos is not preserved.

I generate all the controls on the server at every return to the server,
hence I wish I could get the position at the page_load event
and set them back again before returning to the client, or is there another
clever solution for how to set the scroll bar position dynamically ?

Regards,
Heidi

[Top] [Bottom] [Listen] [Edit] [Reply]

<< Prev | Next >> | Last

Subscribe to this thread

Conditions of Use | Privacy Notice