Behålla position på scrollbars
Det jag sökte var att kunna behålla positionen på scrollbars efter postback, men bara på vissa knappar. I Asp.Net kan man ju använda SmartNavigation till detta men det fungerar bara i IE (när jag provade senast) och ger en del oväntade buggar som bieffekt. Sen finns det också MaintainScrollPositionOnPostback, som man kan lägga i @Page-direktivet men då sker ompositionering på alla länkar och knappar som utlöser postback. Ibland vill man bara att vissa typer av postningar ska göra det.
Lösningen som använder javascript och två gömda input-fält hittade jag i detta forumet skrivet av Fredrik Normén
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Scrollbar position</title>
<script language="javascript">
function SetScrollerPosition()
{
if (document.getElementById("XPos").value != "")
{
var x = document.getElementById("XPos").value;
var y = document.getElementById("YPos").value;
window.scrollTo(x, y);
}
document.getElementById("XPos").value = "0";
document.getElementById("YPos").value = "0";
}
function GetScollerPosition()
{
var scrollX, scrollY;
if (document.all)
{
if (!document.documentElement.scrollLeft)
scrollX = document.body.scrollLeft;
else
scrollX = document.documentElement.scrollLeft;
if (!document.documentElement.scrollTop)
scrollY = document.body.scrollTop;
else
scrollY = document.documentElement.scrollTop;
}
else
{
scrollX = window.pageXOffset;
scrollY = window.pageYOffset;
}
document.getElementById("XPos").value = scrollX;
document.getElementById("YPos").value = scrollY;
}
</script>
</head>
<body onload="SetScrollerPosition();">
<form id="form1" runat="server">
<div>
<asp:GridView >
<Columns>
<asp:TemplateField ShowHeader="False">
<ItemTemplate>
<asp:LinkButton
OnClientClick="GetScollerPosition();"
ID="LinkButton1"
runat="server"
CommandName="Edit"
Text="Edit"></asp:LinkButton>
<asp:LinkButton
ID="LinkButton2"
runat="server"
CommandName="Select"
Text="Select"></asp:LinkButton>
<asp:LinkButton
ID="LinkButton3"
runat="server"
CommandName="Delete"
Text="Delete"></asp:LinkButton>
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
</div>
<input type="hidden" id="XPos" runat="server" />
<input type="hidden" id="YPos" runat="server" />
</form>
</body>
</html>
Under mitt googlande efter detta hittade jag även ett annat intressanta demo på samma ämne. Detta rullar ner en div med overflow till nedersta positionen så fort man lägger till någon i den. Perfekt om man ska göra en AJAX-chatt eller liknande. Detta kommer jag igång att jag försökt lösa tidigare utan lycka.
Tags