HOWTO: Persist Scroll Position in Panel Control on Postback

Discussion in 'ASP .Net Web Controls' started by Elroyskimms, Oct 2, 2006.

  1. Elroyskimms

    Elroyskimms Guest

    Using .Net 2.0 and VB.Net

    I have a Panel control in a user control. This Panel contains several
    other controls with buttons and dropdownlists. Anytime the user would
    click one of these button or dropdown controls, a postback would occur
    and the Panel scroll position would be lost. Some MVP's recommended:

    Page.MaintainScrollPositionOnPostBack = True

    This is the .Net 2.0 replacement for Page.SmartNavigation = True.
    However, this only seems to apply to maintaining the scrollbar position
    of the Page and not the Panel control. (BTW - If anyone knows how to
    apply MaintainScrollPositionOnPostBack to a Panel, please let me
    know!).

    I've read articles about how to do this using an IE "Behavior" and an
    ..htc file but I was hoping to find something that might be less browser
    specific. I'd searched the news groups and couldn't find anything so I
    came up with my own solution which seems to work well. Because I
    couldn't find a posted solution, I thought I might post this and hope
    that it helps someone in the future.

    The solution requires an ASP.Net HiddenField control to save the scroll
    position when the form submits and of course, a Panel control with
    scrollbars. In this case, I'm using horizontal scroll bars and my
    example code will only work for horizontal positioning (although
    vertical positioning is easy as I will show you). Here are the
    controls:

    <asp:panel ID="pnlGallery" runat="server" ScrollBars="Horizontal"
    Width="200px" >
    <!-- Add your controls to the Panel in order to activate the scroll
    bars -->
    </asp:panel>
    <asp:HiddenField ID="hfScrollPosition" runat="server" />


    In your Page_Load procedure, add the following code:

    Dim CSManager As ClientScriptManager = Page.ClientScript

    If Not CSManager.IsOnSubmitStatementRegistered(Me.GetType,
    "SaveScrollPosition") Then

    Dim JScript As String

    JScript = "var HiddenField = document.getElementById('" &
    hfScrollPosition.ClientID & "');" & vbCrLf

    JScript &= "var ScrollElement = document.getElementById('" &
    pnlGallery.ClientID & "');" & vbCrLf

    JScript &= "HiddenField.value = ScrollElement.scrollLeft;" & vbCrLf

    CSManager.RegisterOnSubmitStatement(Me.GetType, "SaveScrollPosition",
    JScript)

    End If

    If Not CSManager.IsStartupScriptRegistered(Me.GetType,
    "RetrieveScrollPosition") Then

    Dim JScript As String

    JScript = "var HiddenField = document.getElementById('" &
    hfScrollPosition.ClientID & "');" & vbCrLf

    JScript &= "var ScrollElement = document.getElementById('" &
    pnlGallery.ClientID & "');" & vbCrLf

    JScript &= "if(HiddenField.value != '')" & vbCrLf

    JScript &= "{" & vbCrLf

    JScript &= "ScrollElement.scrollLeft = HiddenField.value;" & vbCrLf

    JScript &= "}" & vbCrLf

    CSManager.RegisterStartupScript(Me.GetType, "RetrieveScrollPosition",
    JScript, True)

    End If
    /////////////////////////////////////

    You can find more info on the ClientScriptManager here:
    http://msdn2.microsoft.com/en-us/library/system.web.ui.clientscriptmanager.aspx

    The RegisterOnSubmitStatement sets the javascript to run on the
    postback (dropdownlist index change, button click, etc.) and the
    RegisterStartupScript sets that javascript to run when the page loads.
    On Postback, the horizontal position is stored in the HiddenField. When
    the Page loads, the value is read from the HiddenField and the scroll
    position is set.

    For vertical scroll position there are only a couple of changes. First,
    the Panel control must have Vertical (or Auto) scrollbars. Second,
    instead of getting and setting ScrollElement.scrollLeft, get and set
    ScrollElement.scrollTop. If you want both horizontal and vertical,
    you'll need 2 HiddenFields to get the job done.

    I hope this is helpful to someone else!
    Elroyskimms, Oct 2, 2006
    #1
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. =?Utf-8?B?cm11bnNvbjg=?=

    Panel scroll position reset on postback

    =?Utf-8?B?cm11bnNvbjg=?=, Sep 24, 2005, in forum: ASP .Net
    Replies:
    3
    Views:
    20,719
    Chris Botha
    Sep 24, 2005
  2. Sobin

    HELP ME...Panel control not maintaining scroll position

    Sobin, Dec 30, 2007, in forum: ASP .Net Building Controls
    Replies:
    0
    Views:
    781
    Sobin
    Dec 30, 2007
  3. prasad srirambhatla
    Replies:
    2
    Views:
    308
    Teemu Keiski
    Aug 28, 2003
  4. Jason James

    Scroll position in panel control

    Jason James, Mar 26, 2006, in forum: ASP .Net Web Controls
    Replies:
    1
    Views:
    222
    Steve C. Orr [MVP, MCSD]
    Mar 26, 2006
  5. Replies:
    0
    Views:
    583
Loading...

Share This Page