Preserving the scroll position of a treeview in an update panel

Hi There,

I have a treeview control in a panel with scrollbars. I want to preserve the scroll position and I have this code which works absolutely fine in firefox, but it doesn't in IE. Can somebody please get back to me, if you have experienced this problem and solved it.

Also I noticed that if I put an alert (commented), it works fine, which is absolutely weird.

Thanks a lot!!

<scripttype="text/javascript">

var scrollTop;

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

function BeginRequestHandler(sender, args)

{

var elem = document.getElementById('<%= treePanel.ClientID %>');

scrollTop=elem.scrollTop;

}

function EndRequestHandler(sender, args)

{

//alert(scrollTop);

var elem = document.getElementById('<%= treePanel.ClientID %>');

elem.scrollTop = scrollTop;

}

</script>

I noticed one more weird thing. I have roles set up on this application. If a user is in the admin role, this works fine. But if the user is not in that role, then the scrolling is not preserved, whenever a node is selected. I have absolutely no idea why this is happening..This is the case only in IE. Firefox has no problem at all.

Any suggestions are greatly appreciated..

Thanks a lot!!

Change:

Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);

to:

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(PageLoadedHandler);

and change the name of your function. endRequest happens when control has been returned to the browser, but everything may not have been rendered on the page. Your code is getting ahead of itself.

Thanks a lot for your suggestion. It still doesn't work...thisis what I have..

<scripttype="text/javascript">

var scrollTop;

Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);

Sys.WebForms.PageRequestManager.getInstance().add_pageLoaded(PageLoadedHandler);

function BeginRequestHandler(sender, args)

{

var elem = document.getElementById('<%= treePanel.ClientID %>');

scrollTop=elem.scrollTop;

}

function PageLoadedHandler(sender, args)

{

var elem = document.getElementById('<%= treePanel.ClientID %>');

elem.scrollTop = scrollTop;

}

</script>

IE evidently has difficult with scrollTop under certain DOCTYPE definitions.

Replace elem.scrollTop = scrollTop; with

elem.scrollTo(0,scrollTop);

Unfortunately, scrollTo is not recognized in IE 7. I am not sure about IE 6.

As I have mentioned earlier, there is one more weird thing. I have roles set up on this application. If a user is in the admin role, this (script with scrollTop) works fine. But if the user is not in that role, then the scrolling is not preserved, whenever a node is selected. I have absolutely no idea why this is happening..This is the case only in IE. Firefox has no problem at all.

Thanks.

http://www.eggheadcafe.com/tutorials/aspnet/7dd57635-0587-42ba-ae73-f52449e653bf/aspnet-ajax-maintain-scr.aspx

http://forums.asp.net/p/1150033/1873660.aspx

http://aspnet.4guysfromrolla.com/articles/111704-1.aspx

<pages smartNavigation="true"MaintainScrollPositionOnPostback="true"/>

Usually People loves to maintain the scroll postiion. But requirment is reverse, Here is the trick, create an script tag after the scriptmanager and put the following lines:

<script type="text/javascript">var prm = Sys.WebForms.PageRequestManager.getInstance();prm.add_beginRequest(beginRequest);function beginRequest(){ prm._scrollPosition = null;}</script> 

Let me know if this helpful to you

I got this working from the links in the second link you have posted..

I have onscroll="javascript:saveScroll();" on the panel and..

<script type='text/javascript'>
var scrollLeft = 0;

function setScroll()
{
if(document.getElementById('<%= Panel1.ClientID %>').scrollLeft != scrollLeft)
{
document.getElementById('<%= Panel1.ClientID %>').scrollLeft = scrollLeft;
}
}

function saveScroll()
{
scrollLeft = document.getElementById('<%= Panel1.ClientID %>').scrollLeft;
}
</script>

The condition forces the scrolling..

Thanks a lot.

Also thanks to Mr. Budda for his suggestions...