Re: Scroll to top of the page on postback

  •  06-05-2007, 4:13 PM

    Re: Scroll to top of the page on postback

    Hello Adam,
    Here is the code to demonstrate the problem. If the "Cute Editor" control is removed from the page, the scroll position is maintained. However, with the "Cute Editor" control on the page, the scroll position is reset to the top (sometimes after jumping up/down a few times).
     
    <!--
    <%@ Page language="c#"%>
    <%@ Register TagPrefix="CE" Namespace="CuteEditor" Assembly="CuteEditor" %>

    <script runat="server" language="C#">
     void Page_Load(object sender, EventArgs e)
     {
      //SET/RESTORE scroll position
      string lastPosition = "0";
      if (IsPostBack) {
       lastPosition = Request.Form["__SCROLL_POSITION"];
      }
      
      //register hidden field on the page (will keep last position)
      RegisterHiddenField("__SCROLL_POSITION", lastPosition);
     }
    </script>

    <script language="javascript">
     //SET scroll position
     function SetScrollLocation() {
      document.body.scrollTop = document.forms[0].__SCROLL_POSITION.value;
     }
     //call function when "onLoad" fires
     window.onload = SetScrollLocation;
     
     
     //SAVE scroll position
     function SaveScrollLocation() {
      document.forms[0].__SCROLL_POSITION.value = document.body.scrollTop;
     }
     //call function when scrolling
     window.onscroll = SaveScrollLocation;
    </script>


    <html>
     <body>

      <form id="Form1" method="post" runat="server">
      
       <div style="height:700px">
        <span style="color:red;">TOP of the Page</span><br/>
        This is just a placeholder that takes up space on the page
       </div>
       <div style="height:400px;">
        This is another placeholder, but it contains a button to trigger a postback<br/>
        <asp:Button ID="MyButton" Runat="server" Text="Scroll and then click me"></asp:Button>
       </div>
      
       <!-- "Cute Editor" control -->
       <CE:Editor id="Editor" runat="server" ConfigurationPath="~/CuteSoft_Client/CuteEditor/Configuration/AutoConfigure/full.config"
          AutoParseClasses="false" Focus="false">
       </CE:Editor>

      </form>

     </body>
    </html>
    -->
View Complete Thread