Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / web / ASP.NET

Maintain Scroll Position Problem fix for Chrome.

5.00/5 (9 votes)
14 Jun 2011CPOL1 min read 79.4K  
How to maintain scroll position of a long page with vertical scrollbar in browser other than IE.
In most of our long pages which appear in the browser with vertical scrollbar, we need to maintain the scroll prosition after postback for better user experience.

To achieve this, there is a property defined in the Page class called MaintainScrollPositionOnPostBack. We just need to set it to true at server side like the following code snippet.
this.MaintainScrollPositionOnPostBack = true;


This works perfectely fine on all IE browsers but does not work when you are using Chrome. To maintain the scroll position on Chrome or any other browser, you need to add definitions specific to a browser. For this, ASP.NET has provided Browser Deninition file (.browser), where we can define the definitions for individual browser. ASP.NET uses this information in the request header to determine what type of browser has made the request. ASP.NET identifies this using the refID attribute defined in the .browser file, then ASP.NET uses the defenitions defined .browser file to determine the capablilites of the browser. ASP.NET control adapters use this information to render the client scripts and HTML according to the browser type, so that it will be compatible with the requester browser.

To support the scroll position capability in Chrome, you need to follow the steps given below:
  1. Add the following line of code in the Page_Load of the page for which you want to maintain the scroll position.
    this.MaintainScrollPositionOnPostBack = true;
  2. Right click on the project.
  3. Click on “Add” -> “Add New Item”.
  4. In the “Add New Item” window, select “Browser File” and click “Add”.
  5. Application will ask you to place this file in “App_Browsers” folder, click “Yes”
  6. Now add the capability of maintaining the scroll position as follows:
    <browsers>
      <browser refID="Safari1Plus">
        <capabilities>
          <capability name="supportsMaintainScrollPositionOnPostback" 
              value="true" />
        </capabilities>
      </browser>
    </browsers>



To know more about .browser file, you can visit MSDN [^].

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)