Firefox "jumps" when using UpdatePanel and SetFocus in an <iframe> (asp.net)
I have the problem that Firefox "jumps" (moves the scrollbar to the top) if I use an UpdatePanel together with the SetFocus function inside an iframe. I'll show this by posting the code:
First of all the HTML of the webform:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<!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></title>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="True" onselectedindexchanged="DropDownList1_SelectedIndexChanged">
<asp:ListItem>1</asp:ListItem>
<asp:ListItem>2</asp:ListItem>
<asp:ListItem>3</asp:ListItem>
<asp:ListItem>4</asp:ListItem>
<asp:ListItem>5</asp:ListItem>
</asp:DropDownList>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
Now the codebehind to that form (it has no functions except an empty page_load and this one):
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
Label1.Text = DropDownList1.SelectedIndex.ToString();
SetFocus(DropDownList1);
}
OK, this form is hosted inside a barebone HTML page using an iframe. Here is the HTML host page:
<!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>
<title></title>
</head>
<body>
<div>
bla bla bla
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<iframe src="Web开发者_开发百科Form1.aspx" style="height: 1263px; width: 1254px"></iframe>
</div>
</body>
</html>
I added the br elements because you need to have scroll bars to see the effect. Now if you scroll down in the host page and chose a value in the dropdownlist in the iframe in Internet Explorer, the Label gets updated without any problems and the dropdownlist gets the focus.
Now try the same in Firefox - everything works too, but you get the annoying effect that firefox scrolls the html host page to the top again!
I tried it with even bigger pages and multiple iframes, and it seems to scroll to the beginning of the one iframe in which you have chosen the value in the dropdownlist. Safari (and I guess Chrome) has the same behavior. Opera doesn't do this annoying "jump" (same with IE).
What is the problem here?
OK, after lots of searching I've found the solution:
http://forums.asp.net/t/1622050.aspx/1/10
User "DotNetSeeker" had the right solution in that thread.
精彩评论