ASP.NET form validation Not working for the first time

Question

<asp:UpdatePanel ID="LoginPanel" UpdateMode="Conditional" runat="server"> <ContentTemplate> <div id="login"> <div class="row"> <div class="label"> <asp:Label ID="lblUsername" Text="<%$ Resources:Login, UserNameField %>" runat="server" /> </div> <div class="field"> <asp:TextBox ID="txtUsername" MaxLength="12" runat="server" /> <asp:RequiredFieldValidator ID="rfvUsername" ControlToValidate="txtUsername" ValidationGroup="vgLogin" SetFocusOnError="true" ErrorMessage="*" ToolTip="<%$ Resources:Login, UserNameRequired %>" runat="server" /> </div> </div> <div class="row"> <div class="label"> <asp:Label ID="lblPassword" Text="<%$ Resources:Login, PasswordField %>" runat="server" /> </div> <div class="field"> <asp:TextBox ID="txtPassword" MaxLength="12" TextMode="Password" runat="server" /> <asp:RequiredFieldValidator ID="rfvPassword" ControlToValidate="txtPassword" ValidationGroup="vgLogin" SetFocusOnError="true" ErrorMessage="*" ToolTip="<%$ Resources:Login, PasswordRequired %>" runat="server" /> </div> </div> <div class="row"> <div class="label"> <asp:Label ID="lblRemember" Text="<%$ Resources:Login, RememberField %>" runat="server" /> </div> <div> <asp:CheckBox ID="chkRemember" Checked="true" ToolTip="<%$ Resources:Login, RememberToolTip %>" runat="server" /> </div> </div> <div class="buttons"> <asp:Button ID="btnLogin" Text="<%$ Resources:Login, Command %>" OnClick="btnLogin_Click" ValidationGroup="vgLogin" CausesValidation="true" runat="server" /> </div> </div> </ContentTemplate> </asp:UpdatePanel> 

For the first time, validators will not check if the fields are filled or not, the form is simply submitted regardless of the fact that after this initial hiccup the form is checked correctly every time.

I know that I can just ask (and I should, independently) if Page.IsValid on the server side, but I still would like the verification to correctly warn the user input error for the first time, and not expect the server to respond first.

What am I doing wrong?

Answer 1

The loading order of JS files can cause problems here if there are dependencies between them. Due to random delays, some dependencies may not have been satisfied, leading to a break in functionality. Your console can give hints if so. On subsequent page loads, everything looks fine, because the JS files were cached and now load without delay in the correct order.

What you need to try:

• Play with JS inclusion order
• Try deferring the use of dependencies until body.onload is fired.
• You can also try the rather active solution offered on aspdotnetfaq .

Hope this helps.

Answer 2

I had something similar when a large number of downloadable javascript was loaded or when there was an unrelated javascript error (usually, but not always, associated with a lot of javascript.

Answer 3

This may not be the answer, but in the past I have run into similar problems. ASP Validation Controls really do not seem to be “well-playing” inside UpdatePanels. I think the reason is that when they try to perform some type of check, they also try to write to the watch page. However, the viewstate is outside the Update Panel area, which means that you are updating the “middle” page without updating the entire state of the page, making the state of your controls out of sync.

In any case, to prove this, remove the update panel from your controls, submit the form and see if your checks work.

Unfortunately, for a workaround, Ive created custom javascript functions for client-side validation, and then also performs server-side validation and displays any errors. In these scenarios, Ive avoided using ASP.NET controls.

Good luck = \