Wondering if any one has a good example for the issue below:

I have a table which displays sql results. Within each row i have an image hyperlink which allows me to open a hidden row directly below the record using a querystring.

In this row is a simple form which posts a value back to the page.

What i am having issues with is the ability to maintain the possition of the page after postback. By using a simple <a name="unique_name"> in the row i can get a blocky navigation to the row but as with <a> names it display the row at the top of the page.

Below is a mockup of the table with both the record row and hidden row:

I have been looking at various javascript examples but have not got any to work as yet.

Below is an example of page location that i have not been able to adapt:

http://forums.asp.net/t/336101.aspx

Put before end your form (before </form> tag):



<input id="__SAVESCROLL" name="__SAVESCROLL" value="0" type="hidden" runat="server" />
<script type="text/javascript" src="SaveScroll.js"></script>


To the SaveScroll.js file put:



function saveScroll()
{
var sScroll;
if (document.documentElement && document.documentElement.scrollTop)
sScroll = document.documentElement.scrollTop;
else if (document.body)
sScroll = document.body.scrollTop;
else
{
sScroll = 0;
}
document.getElementById('__SAVESCROLL').value = sScroll;
}

function restoreScroll()
{
var sScroll = document.getElementById('__SAVESCROLL').value;
if (sScroll > 0)
{
if (document.documentElement && document.documentElement.scrollTop)
document.documentElement.scrollTop = sScroll;
else if (document.body)
{
if (window.navigator.appName == 'Netscape')
window.scroll(0, sScroll);
else
document.body.scrollTop = sScroll;
}
else
{
window.scroll(0, sScroll);
}
// here is setting absolute positioning panel, if you need, set correct ID and uncomment follow 2 lines (and add needed lines/setting for all your panels)
//if (document.getElementById('pnlNewItem') != null )
//document.getElementById('pnlNewItem').style.top = sScroll + 'px';
}
}

window.onload = restoreScroll;
window.onscroll = saveScroll;
window.onresize = saveScroll;



To the head section of page put this conditionally comment meta-tag for quick page transition(in IE6+ will create very smooth postback, in other will be ignored because they dont support transition or dont support 0.1 time to play transition)



<!--[if gte IE 6]><meta http-equiv="Page-Enter" content="BlendTrans(Duration=0.1)" /><![endif]-->
If anyone can point me in the right direction that would be superb.

Cheers

Aspless

Add a div tag to your page. and add the restoreScroll to it like this

<div id = "myDiv" runat = "server">
<script type="text/javascript">
restoreScroll();
</script>
</div>

when this div tag is loaded into the browser codes are executed.

Thanks irProject,

This looks like a really simple solution.

I have attempted to integrate the Javascript into the above example but am getting 'Object expected'.

Still unsure how i can get the value to restoreScroll() ..

Any additional advice would be great.

Cheers

Aspless

you should put a hidden input in your page to store value of scroll
<input type="hidden" id="myHidden" />

and in your page write the code of restoreScroll function like this:

<div id = "myDiv" runat = "server">
<script type="text/javascript">
function restoreScroll()
{
// code goes here
}
// call function
restoreScroll();
</script>
</div>