Maintain Panel Scroll Position On Partial Postback ASP.NET

I have a gridview that putted in ASP.NET Panel.
both of panel and Gridview are in an UpdatePanel.
there is a column in gridview that Causes Partial PostBacks.
i want to Maintain Panel Scroll position on those postbacks.
Is there any way?
regards.

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

There is no built-in facility to resolve it in asp.net

However, there is a workaround for this problem; You need to handle it with javascript.

Solution is mentioned here: Maintain Scrollbar Position Inside UpdatePanel After Partial PostBack

Edited 20-May-2012; after seeing the comments

<form id="form1" runat="server">
  <asp:ScriptManager ID="ScriptManager1" runat="server" ScriptMode="Release" />
   <script type="text/javascript">
      // It is important to place this JavaScript code after ScriptManager1
      var xPos, yPos;
      var prm = Sys.WebForms.PageRequestManager.getInstance();

      function BeginRequestHandler(sender, args) {
        if ($get('<%=Panel1.ClientID%>') != null) {
          // Get X and Y positions of scrollbar before the partial postback
          xPos = $get('<%=Panel1.ClientID%>').scrollLeft;
          yPos = $get('<%=Panel1.ClientID%>').scrollTop;
        }
     }

     function EndRequestHandler(sender, args) {
         if ($get('<%=Panel1.ClientID%>') != null) {
           // Set X and Y positions back to the scrollbar
           // after partial postback
           $get('<%=Panel1.ClientID%>').scrollLeft = xPos;
           $get('<%=Panel1.ClientID%>').scrollTop = yPos;
         }
     }

     prm.add_beginRequest(BeginRequestHandler);
     prm.add_endRequest(EndRequestHandler);
 </script>

 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
   <ContentTemplate>
     <asp:Panel ID="Panel1" runat="server" Height="300">
        <%-- Some stuff which would cause a partial postback goes here --%>
     </asp:Panel>
   </ContentTemplate>
 </asp:UpdatePanel>

</form>

Below is the code snapshot:-

Maintain Scrollbar Position Inside UpdatePanel After Partial PostBack

Method 2

Add MaintainScrollPositionOnPostback=”true” to your page directive.

Method 3

I was looking for an answer to this problem for several days, using the typical alternative of MaintainScrollPositionOnPostback and the JavaScript solutions using BeginRequestHandler and EndRequestHandler where in my case I use MasterPage.

Nothing worked, however I came up with a fairly simple solution using jQuery with BeginRequestHandler and EndRequestHandler using the same @waqas-raja algorithm:

<script type="text/javascript">

    var scrollPosition = 0;

    $(document).ready(function () {

        $(window).scroll(function (event) {
            scrollPosition = $(window).scrollTop();
        });

    });

</script>

<script type="text/javascript">

    // It is important to place this JavaScript code after ScriptManager1
    var xPos, yPos;
    var prm = Sys.WebForms.PageRequestManager.getInstance();

    function BeginRequestHandler(sender, args) {
        console.log('BeginRequest');
    }

    function EndRequestHandler(sender, args) {
        $(window).scrollTop(scrollPosition);
    }

    prm.add_beginRequest(BeginRequestHandler);
    prm.add_endRequest(EndRequestHandler);

</script>

The idea is to capture the position of the Scroll in a global variable each time the user moves the Scroll, in this way it is known which was the last position and when making the postback the EndRequestHandler event is entered and updated with the last position what the user marked

This worked for me in Firefox and Google Chrome 🙂


All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes
Article Rating
Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x
()
x