Detect if Asp.Net form is valid with javascript/jquery
Solution 1
Okay I found a solution. Page_ClientValidate() does the trick.
function showLoading() {
if (Page_ClientValidate()) { $("#loader").show(); }
else { alert("Form is invalid!"); }
}
Solution 2
I think it would be better to use the property Page_IsValid instead of the method Page_ClientValidate().
function showLoading() {
if (Page_IsValid) { $("#loader").show(); }
else { alert("Form is invalid!"); }
}
Solution 3
If you don't want to call Page_ClientValidate() you can use Page_IsValid but set a timeout so that the validation occurs first.
OnClientClick="javascript:setTimeout(function() { if (Page_IsValid) document.getElementById('preloader').style.display='block';}, 1000);"
the preloader is hidden in the middle
<img src="/images/preloader.gif" id="preloader" style="display:none; position: fixed; top: 50%; left: 50%; margin-top: -50px; margin-left: -100px;" />
HasanG
I love stack overflow! :) Hasan Gürsoy @ innovacube "As I always say; Every solution creates a new problem"
Updated on June 16, 2022Comments
-
HasanG almost 2 years
I have a form which is in an updatePanel and I have a span with hidden loading image, which I want to show when user clicks to submit button but I first need to check if page is valid on client side. Also I'm making loading span visible with jQuery. Here is my code:
<html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script type="text/javascript"> function showLoading() { $('#loader').show(); } </script> </head> <body> <asp:ScriptManager ID="smMain" runat="server"></asp:ScriptManager> <asp:UpdatePanel ID="upForm" runat="server"> <ContentTemplate> <asp:MultiView ID="mvContact" runat="server" ActiveViewIndex="0"> <asp:View ID="vDefault" runat="server"> <asp:TextBox ID="tEMail" runat="server" CssClass="input" /> <asp:RequiredFieldValidator ID="rfvEMail" runat="server" ControlToValidate="tEMail" ErrorMessage="* required" Display="Dynamic" /> <asp:RegularExpressionValidator ID="revEMail" runat="server" ControlToValidate="tEMail" ErrorMessage="* invalid" Display="Dynamic" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" /> <asp:ImageButton ID="btnSubmit" runat="server" ImageUrl="~/Assets/Images/btnSubmit.png" ToolTip="Submit Form" style="margin:5px 5px 0 -5px" onclick="btnSubmit_Click" OnClientClick="showLoading();" /> <span id="loader"><img src="Assets/Images/loader.gif" title="Sending..." /></span> </asp:View> <asp:View ID="vResult" runat="server"> <div class="result"> <span id="lResult" runat="server">Your message is sent</span> </div> </asp:View> </asp:MultiView> </ContentTemplate> </asp:UpdatePanel> </body></html>