Fredrik Normén's Blog - NSQUARED²
Any fool can write code that a computer can understand. Good programmers write code that humans can understand.

Microsoft Most Valuable Professional
     .Net Framework - ASP.Net - Architecture - Development
NOTE: This list of posts will only list the 15 latest posts, to see the rest, select from the Archives located in the menu to the left. The RSS will only list the 10 lastest posts.
Keep the scroll position of a DIV after postback

Category:  ASP.Net 2.0

Maybe this Tips & Trix will be useful to some of you; at least I have seen that kind of question a lot of times. It’s about how to remain scroll positions in a <DIV> after a postback. The following will show you an example of how to do it; I use two client-side methods, one to save the scroll top position of the DIV, and one to restore it. I use a server-side <input> element to make sure to its value will be saved in the ViewState during postbacks (in that way I can keep the state of the scroll position of the DIV):

 

<body onload="setScrollPos('myDiv')">

 

    <form id="form1" runat="server">

 

        <div id="myDiv" onscroll="saveScrollPos(this);" style="height:50px; width:100%; overflow:auto;">

             ...

        </div>

 

        <asp:Button runat="server" ID="Button1" Text="Press Me!" />

 

        <input type="hidden" id="scrollPos" name="scrollPos" value="0" runat="server"/>

 

    </form>

   

    <script type="text/javascript" language="javascript">

   

        function saveScrollPos(object)

        {

            document.getElementById('scrollPos').value = object.scrollTop;

        }

 

        function setScrollPos(elementId)

        {

            document.getElementById(elementId).scrollTop = document.getElementById('scrollPos').value;

        }

       

    </script>

 

</body>

 

 

Posted: Friday, March 30, 2007 - 07:48 GMT+1    Print     E-mail    Comments (4)
   fredrik.nsquared2.com - 2007