Hi
A few days back I came up with an interesting requirement. I was working on a page, which had a scrollable div. The problem was that after the post back the div would loose its scroll position. Now when there is a lot of data it is very inconvenient for the user to again scroll back to the position where he was before the post back.
One of my colleagues helped me out with the solution. The solution was quite simple. We saved the value of the scroll in a hidden variable. This was done on the onscroll event of the div. On the page load event of the page we again set the scroll of the div to the value saved in the hidden variable. That’s all. Here is a simple code to show the actual working.
<body onload="SetVikScroll()">
<form id="form1" runat="server">
<div id="VikramDiv" onscroll="saveScrollPos();" style="height:50px; width:100%; overflow:auto;">
<!--Some stuff to get some scroll in the div -->
</div>
<asp:Button runat="server" ID="buttonForPostBack" Text="Post Back Button" />
<input type="hidden" id="VikramscrollPos" name=" VikramscrollPos" value="0" runat="server"/>
</form>
<script type="text/javascript" language="javascript">
function saveScrollPos()
{
document.getElementById(“VikramscrollPos”).value = document.getElementById(“VikramDiv”).scrollTop;
}
function SetVikScroll()
{
document.getElementById(“VikramDiv”).scrollTop = document.getElementById(“VikramscrollPos”).value;
}
</script>
</body>
Thanks
Vikram