Hi All,
So, I'm starting a new post that is related to my initial post from approximately 7 months ago (http://forums.asp.net/t/1040392.aspx). My hope is to finally find a solution to this problem... here is the issue:
A couple of our Ajax enabled pages have a lot of form fields, thus a user has to scroll to the bottom of the page to view the Submit button. When a control's RequireFieldValidator's EnableClientScript property is set to"true", upon a validation error the page will scroll up to the ValidationSummary. This is the functionality that I desire. But, when a control's RequireFieldValidator's EnableClientScript property is set to"false", upon a validation error the page does NOT scroll up to the ValidationSummary. Why not?
Here is a quick code sample to illustrate the problem:
<%@dotnet.itags.org.PageLanguage="C#"AutoEventWireup="true"CodeFile="ValidationTest.aspx.cs"Inherits="Register_Playground_Shamus_ValidationTest" %>
<!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<htmlxmlns="http://www.w3.org/1999/xhtml">
<headrunat="server">
<title>Validation Test</title>
</head>
<body>
<formid="form1"runat="server">
<div>
<asp:ScriptManagerID="asmScriptManager"EnablePartialRendering="true"runat="server"/>
<asp:UpdatePanelID="udpUpdatePanel"runat="server">
<ContentTemplate>
<asp:ValidationSummaryID="valSummary"runat="server"/>
<!-- Lots of space to induce scrolling upon a validation error. -->
<p>Scroll Down</p>
<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/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
<asp:TextBoxID="TextBox1"runat="server"/><asp:RequiredFieldValidatorID="RequiredFieldValidator1"EnableClientScript="true"ControlToValidate="TextBox1"runat="server"ErrorMessage="* TextBox1"/><br/>
<asp:TextBoxID="TextBox2"runat="server"/><asp:RequiredFieldValidatorID="RequiredFieldValidator2"EnableClientScript="false"ControlToValidate="TextBox2"runat="server"ErrorMessage="* TextBox2"/><br/>
<asp:ButtonID="Button1"runat="server"Text="Button"/>
</ContentTemplate>
</asp:UpdatePanel>
</div>
</form>
</body>
</html>
And, the codebehind...
using System;using System.Data;using System.Configuration;using System.Collections;using System.Web;using System.Web.Security;using System.Web.UI;using System.Web.UI.WebControls;using System.Web.UI.WebControls.WebParts;using System.Web.UI.HtmlControls;public partialclass Register_Playground_Shamus_ValidationTest : System.Web.UI.Page{protected void Page_Load(object sender, EventArgs e) { }}The only difference between TextBox1 and TextBox2 is their RequiredFieldValidator's EnableClientScript property (TextBox1 is true and TextBox2 is false). To reproduce the issue:
- Load the page, scroll to the bottom and click the "Button" without entering any text into the text boxes.The page will scroll to the top and you will see the validation summary (good!).Scroll back down to the bottom of the page and put some text into the first textbox. Click the "Button".The page will NOT scroll to the top (bad!).
All I want is for the page to scroll to the top in both scenarios.
Thanks,
-Shamus
So, I fixed the problem with a hack... here is the new codebehind code:
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
public partialclass Register_Playground_Shamus_ValidationTest : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (Page.IsPostBack)
{
Page.Validate();
if (!Page.IsValid)
{
ScriptManager.RegisterStartupScript(this,this.GetType(),"ReturnToTop","setTimeout(\"window.scrollTo(0,0)\",1);",true);
}
}
}
}
By adding a 1 millisecond timeout before calling window.scrollTo() it now works. If you remove the timeout, then when there is a validation error on Textbox2 the page will not scroll to the top. Personally, I hate hacks like this... I would still love to understand why the client vs. server-side validators behave so differently.
I hope this hack helps somebody else...
-Shamus
Yes sure, it will help for others
1 comment:
Yep. It helped me. Ajax, jquery and asp.net do not play nicely.
Post a Comment