HOME

Thursday, February 16, 2012

Maintain Scroll Position On every Postback or Refresh in ASP.Net

These are the steps to Maintain Scroll Position On Postback

1.add a javascript file to ur project with scrollsaver.min.js
    content is...
  (function () {
    function ls() {
        var c = document.cookie.split(';');
        for (var i = 0; i < c.length; i++) {
            var p = c[i].split('=');
            if (p[0] == 'scrollPosition') {
                p = unescape(p[1]).split('/');
                for (var j = 0; j < p.length; j++) {
                    var e = p[j].split(',');
                    try {
                        if (e[0] == 'window') {
                            window.scrollTo(e[1], e[2]);
                        } else if (e[0]) {
                            var o = document.getElementById(e[0]);
                            o.scrollLeft = e[1]; o.scrollTop = e[2];
                        }
                    }
                    catch (ex) {
                    }
                }
                return;
            }
        }
    }

    function ss() {
        var s = 'scrollPosition=';
        var l, t;
        if (window.pageXOffset !== undefined) {
            l = window.pageXOffset; t = window.pageYOffset;
        }
        else if (document.documentElement && document.documentElement.scrollLeft !== undefined) {
            l = document.documentElement.scrollLeft;
            t = document.documentElement.scrollTop;
        }
        else {
            l = document.body.scrollLeft;
            t = document.body.scrollTop;
        }
        if (l || t) {
            s += 'window,' + l + ',' + t + '/';
        }
        var es = (document.all) ? document.all : document.getElementsByTagName('*');
        for (var i = 0; i < es.length; i++) {
            var e = es[i];
            if (e.id && (e.scrollLeft || e.scrollTop)) {
                s += e.id + ',' + e.scrollLeft + ',' + e.scrollTop + '/';
            }
        } document.cookie = s + ';';
    } var a, p;
    if (window.attachEvent) {
        a = window.attachEvent; p = 'on';
    } else {
        a = window.addEventListener;
        p = '';
    }
    a(p + 'load', function () {
        ls();
        if (typeof Sys != 'undefined' && typeof Sys.WebForms != 'undefined') {
            Sys.WebForms.PageRequestManager.getInstance().add_endRequest(ls);
            Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(ss);
        }
    }
    , false);
    a(p + 'unload', ss, false);
    })();

2.Give that file reference to your asp.net page


  <script type="text/javascript" src="../../js/scrollsaver.min.js"></script>

3.Add  MaintainScrollPositionOnPostback="true" to Page tage of your asp.net page



<%@ Page Title="" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true" CodeFile="StoresMaterialPurchaseorder.aspx.cs" MaintainScrollPositionOnPostback="true" Inherits="MateialIndent_MaterialPurchaseorder" %>



2 comments:

  1. works great. fyi for others - this script is open source available under CPL license. https://code.google.com/p/opennode2/source/browse/trunk/dotnet/prod-opennode2-net/src/Admin/Scripts/scrollsaver.min.js?r=396

    ReplyDelete
  2. Finally found something that works!!! Thanks so much!

    ReplyDelete