我有一個JQuery驗證器的問題。如果我先按提交按鈕,驗證開始工作。但是,如果表單有效,我想提交。而且我不知道爲什麼驗證字段也會在後面形成。請參閱我的JS代碼註釋JQuery驗證程序在第一次提交後工作 - asp .net
<script src="/static/js/jquery.hint.js" type="text/javascript"></script>
<script src="/static/js/jquery.validate.min.js" type="text/javascript"></script>
<script src="/static/js/additional-methods.js" type="text/javascript"></script>
<script type="text/javascript">
function ValidateForm (e) {
//fix for hint
setTimeout(function()
{ $('input').focus(); },
500);
return $("#contactForm").valid(); //this should prevent call of click event but I don't know why form first time is valid always :(
}
jQuery(function ($) {
var container = $("div.container"), validator;
$(":input[data-hint-title]").hint();
// validate the form when it is submitted
validator = $("#contactForm").validate({
errorContainer: container,
errorLabelContainer: $("ol", container),
wrapper: "li",
meta: "validate",
rules: {
firstname: "required",
lastname: "required",
address: "required",
city: "required",
zipcode: "required",
country: "required",
phone: "required",
email: {
required: true,
email: true
},
confirmEmail: {
required: true,
email: true,
equalTo: "#email"
},
message: {
required: true,
maxlength: 600
}
}
});
validator.resetForm();
});
</script>
這
<form id="contactForm" action="" method="POST" runat="server" ClientIDMode="Static">
<asp:ScriptManager EnablePartialRendering="true"
ID="ScriptManager1" runat="server"></asp:ScriptManager>
<fieldset>
<div class="row justify ibChildren">
<span>
<asp:TextBox runat="server" ID="firstname" data-hint-title="* first name" CssClass="required" ClientIDMode="Static" />
</span>
<span>
<asp:TextBox runat="server" ID="lastname" data-hint-title="* last name" CssClass="required" ClientIDMode="Static" />
</span>
</div>
<span>
<asp:TextBox runat="server" ID="country" data-hint-title="* country" CssClass="required" ClientIDMode="Static" />
<%--<input type="text" name="seach" value="" id="country" data-hint-title="Country" class="required" />--%></span>
</div >
<div class="row justify ibChildren">
<span>
<asp:TextBox runat="server" ID="phone" data-hint-title="* phone" CssClass="required" ClientIDMode="Static" />
<%--<input type="text" name="seach" value="" id="phone" data-hint-title="Phone" />--%></span>
<span>
<%-- <input type="text" name="seach" value="" id="email" data-hint-title="Email" class="required"
type="email" />--%>
<asp:TextBox runat="server" ID="email" data-hint-title="* email" CssClass="required" ClientIDMode="Static" />
</span>
</div>
<div class="row justify ibChildren">
<span>
<asp:TextBox runat="server" ID="productname" data-hint-title="product (name, shade, item #) other" ClientIDMode="Static" />
<%--<input type="text" name="seach" value="" id="productName" data-hint-title="Product Name" class="required" />--%></span>
<span>
<asp:TextBox runat="server" ID="confirmEmail" data-hint-title="* confirm email" CssClass="required" ClientIDMode="Static" />
<%--<input type="text" name="seach" value="" id="confirmEmail" data-hint-title="Confirm Email"
class="required" type="email" />--%></span>
</div>
<div class="row full">
<asp:TextBox runat="server" ID="message" TextMode="multiline" data-hint-title="* message" CssClass="required" ClientIDMode="Static" Columns="20" Rows="2" />
</div>
<div class="row submit">
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="UpdatePanel1">
<ProgressTemplate>
Processing ...
</ProgressTemplate>
</asp:UpdateProgress>
<asp:Label ID="lblStatus" runat="server" Text="" CssClass="requiredHint"></asp:Label>
<asp:Button id="sendMail" runat="server" Text="Submit" CssClass="submit" OnClick="Send_Click" OnClientClick="ValidateForm();" /></ContentTemplate>
</asp:UpdatePanel>
</div>
</fieldset>
<!-- our error container -->
<div class="container" >
<h4>There are serious errors in your form submission, please see below for details.</h4>
<ol>
<li><label for="<%= firstname.ClientID %>" class="error">Please enter your first name</label></li>
...........
<li><label for="<%= lastname.ClientID %>" class="error">Please enter your last name</label></li>
</ol>
</div>
</form>
的HTML代碼切形式是否有任何理由,你爲什麼沒有使用ASP.NET驗證器? – Jupaol
我不喜歡它們,它們不像我那麼靈活和沉重 –
有一個'CustomValidator',您可以使用它來編寫自定義驗證邏輯。關於你的代碼的主要問題是你需要複製你的驗證邏輯(在JavaScript和服務器級別) – Jupaol