我有一个表单,其中有多个下拉列表...如果我要验证单个下拉列表,我的代码工作正常......
使用此代码:
if ($("select[id*=drpR]").val() == "Choose Reseller") {
$("#lblmessage").html("Please choose Reseller!");
return false;//To prevent the form from submitting.
}
else {
return true;
}
但是当我必须验证一个带有3个下拉列表和许多文本框的表单时,我的jquery无法正常工作..现在我将把这个代码块放在哪里以便为我的验证正常运行..或者是否有更好的解决方案我的问题......
这是我的jquery所拥有的:
jQuery("#Merchant_Registration").validate({
rules: {
drpT: {
required: {
depends: function (element) {
var flag = true;
if ($("select[id*=drpT]").val() == "Choose Type") {
//alert("Please select Merchant type");
$("#lbldrpT").append("Please choose Type!");
flag = false;//To prevent the form from submitting.
} else {
$("#lbldrpT").empty();
}
},
},
},
LastName: "required",
FirstName: "required",
EmailAd: {
required: true,
email: true,
minlength: 8
},
CompanyN: "required",
url: "required",
drpI: {
required: {
depends: function (element) {
var flag = true;
if ($("select[id*=drpI]").val() == "Choose Industry") {
$("#lbldrpI").append("Please choose Industry!");
flag = false;//To prevent the form from submitting.
} else {
$("#lbldrpI").empty();
}
},
},
},
HNumber: "required",
stADR: "required",
town: "required",
city: "required",
state: "required",
Zcode: "required",
drpC: {
required: {
depends: function (element) {
var flag = true;
if ($("select[id*=drpC]").val() == "Choose Country") {
$("#lbldrpC").append("Please choose Coutnry!");
flag = false;//To prevent the form from submitting.
} else {
$("#lbldrpC").empty();
}
},
},
},
TNumber: "required",
FNumber: "required"
},
success: function () {
xval = true;
},
messages: {
FirstName: "Please enter your first name",
LastName: "Please enter your first name",
EmailAd: "Please enter a valid email address",
CompanyN: "Please enter company name",
url: "Please enter URL",
HNumber: "Please enter house number",
stADR: "Please enter street",
town: "Please enter town",
city: "Please enter city or municipality",
state: "Please enter state or province",
Zcode: "Please enter zip code",
TNumber: "Please enter telephone number",
FNumber: "Please enter fax number"
}
});
$("select").change(function () {
$("#lbl" + $(this).attr("id")).empty();
})
if (!jQuery("#Merchant_Registration").valid()) {
flag = false;
return false;
}
else {
return true;
}
if (flag) {
return true;
}
else {
return false;
}
这是我的标记:
<div id="step2" class="formwiz">
<h4>Step 2: Personal Information</h4>
<p>
<label>Select Type:</label>
<span class="field">
<asp:DropDownList ID="drpT" runat="server" Width="160" class="required"></asp:DropDownList>
<asp:Label ID="lbldrpT" runat="server" Text="" ForeColor="Red"></asp:Label>
</span>
</p>
<p>
<label>Firstname:</label>
<span class="field">
<asp:TextBox ID="FirstName" runat="server" MaxLength ="50"></asp:TextBox>
</span>
</p>
<p>
<label>LastName:</label>
<span class="field">
<asp:TextBox ID="LastName" runat="server" MaxLength ="50"></asp:TextBox>
</span>
</p>
<p>
<label>Email Address</label>
<span class="field">
<asp:TextBox ID="EmailAd" runat="server"></asp:TextBox>
</span>
</p>
<p>
<label>Company Name:</label>
<span class="field">
<asp:TextBox ID="CompanyN" runat="server"></asp:TextBox>
</span>
</p>
<p>
<label>Website URL:</label>
<span class="field">
<asp:TextBox ID="url" runat="server"></asp:TextBox>
</span>
</p>
<p>
<label>Select Industry:</label>
<span class="field">
<asp:DropDownList ID="drpI" runat="server" Width="160" class="required"></asp:DropDownList>
<asp:Label ID="lbldrpI" runat="server" Text="" ForeColor="Red"></asp:Label>
</span>
</p>
<p>
<label>House Number:</label>
<span class="field">
<asp:TextBox ID="HNumber" runat="server"></asp:TextBox>
</span>
</p>
<p>
<label>Street Address:</label>
<span class="field">
<asp:TextBox ID="stADR" runat="server"></asp:TextBox>
</span>
</p>
<p>
<label>Town:</label>
<span class="field">
<asp:TextBox ID="town" runat="server"></asp:TextBox>
</span>
</p>
<p>
<label>City:</label>
<span class="field">
<asp:TextBox ID="city" runat="server"></asp:TextBox>
</span>
</p>
<p>
<label>State:</label>
<span class="field">
<asp:TextBox ID="state" runat="server"></asp:TextBox>
</span>
</p>
<p>
<label>Zip Code:</label>
<span class="field">
<asp:TextBox ID="Zcode" runat="server" MaxLength="6"></asp:TextBox>
</span>
</p>
<p>
<label>Country:</label>
<span class="field">
<asp:DropDownList ID="drpC" runat="server" Width="160" class="required"></asp:DropDownList>
<asp:Label ID="lbldrpC" runat="server" Text="" ForeColor="Red"></asp:Label>
</span>
</p>
<p>
<label>Telephone Number:</label>
<span class="field">
<asp:TextBox ID="TNumber" runat="server" MaxLength="11"></asp:TextBox>
</span>
</p>
<p>
<label>Fax Number:</label>
<span class="field">
<asp:TextBox ID="FNumber" runat="server" MaxLength="11"></asp:TextBox>
</span>
</p>
</div>
请帮忙......
答案 0 :(得分:0)
var flag = true;
if ($("select[id*=drpT]").val() == "Choose Type") {
//alert("Please select Merchant type");
$("#lbldrpT").append("Please choose Reseller!");
flag = false;//To prevent the form from submitting.
}else{
$("#lbldrpT").empty();
}
if ($("select[id*=drpI]").val() == "Choose Industry") {
$("#lbldrpI").append("Please choose Industry!");
flag = false;//To prevent the form from submitting.
}else{
$("#lbldrpI").empty();
}
if ($("select[id*=drpC]").val() == "Choose Country") {
$("#lbldrpC").append("Please choose Coutnry!");
flag = false;//To prevent the form from submitting.
}else{
$("#lbldrpC").empty();
}
$("select").change(function(){
$("#lbl"+$(this).attr("id")).empty();
// or you can use this
// $(this).parent().find("label").empty();
//second one is better option
})
if (!jQuery("#Merchant_Registration").valid()) {
flag = false;
}
if(flag)
return true;
else
return false;
在你的代码中,你在第一个if条件下返回,所以它永远不会转到下一个if else。所以举旗告诉我是否有问题。