我正在使用jQuery验证来验证表单。我的表格被分割成几个部分。表单的顶部,具有正常输入,验证错误消息正在按照我想要的方式放置。
我的问题是不会显示放在不同部分的特定错误标签。我被告知尝试使用errorplacement
函数,但我不知道如何使用这个函数和一个特定的错误消息。
errorPlacement: function(error, element) {
}
在下面的代码中,您会看到两条HTML
条评论。第一个是说明如果我在那里移动输入,那么将显示错误消息。第二个注释是当前输入和我实际需要的位置,但它不会显示在那里。
输入的ID为#interestHidden
。
有没有人知道如何使用errorplacement
来解决这条错误消息?
请参阅下面的代码
<section class="sec90">
<h3 class="subTC">Enter your information below.</h3>
<form action="" id="salesforce_submit" method="POST" enctype="multipart/form-data">
<div><input id="first_name" placeholder="First Name*" class="input block" maxlength="40" name="first_name" type="text"></div>
<div><input id="last_name" placeholder="Last Name*" class="input block" maxlength="80" name="last_name" type="text"></div>
<div><input id="company" placeholder="Company*" class="input block" maxlength="40" name="company" type="text"></div>
<!-- Moving it here will allow the message to display -->
</section>
<section class="sec90">
<h3 class="subTC">What are you interested in?*</h3>
<!-- Moving it here, it doesn't show -->
<div><input type="hidden" id="interestHidden" name="interestHidden" value=""></div>
<div id="interestWrap">
<div class="interest">
尝试:
errorPlacement: function(error, element) {
if(element.attr("id") == "interestHidden") {
error.html('#interestError');
} else {
//Placement for other interest Hidden
}
},
更新了JS:
$('#salesforce_submit').validate({
ignore: [],
//ignore: "",
rules: {
first_name: {
required: true,
minlength: 2
},
last_name: {
required: true,
minlength: 2
},
email: {
required: true,
email: true
},
phone: {
required: true,
//digits: true,
minlength: 10,
alphanumeric: true
},
zip: {
required: true,
digits: true,
minlength: 5
},
company: {
required: true,
minlength: 2
},
interestHidden: {
required: true,
min: 1
}
},
messages: {
first_name: {
required: "Please enter your first name",
minlength: "Your first name seems a bit short, doesn't it?"
},
last_name: {
required: "Please enter your last name",
minlength: "Your last name seems a bit short, doesn't it?"
},
email: {
required: "Please enter your email address",
email: "Please enter a valid email address"
},
phone: {
required: "Please enter your phone number",
digits: "Please enter a valid phone number with only numbers",
minlength: "Your number seems a bit short, doesn't it?"
},
zip: {
required: "Please enter your zip code",
digits: "Please enter a valid zip code with only numbers",
minlength: "Your zip code seems a bit short, doesn't it?"
},
company: {
required: "Please enter your company name",
minlength: "Your company name seems a bit short. Please enter at least 2 characters"
},
interestHidden: {
required: "Please choose at least one interest",
min: "At least one interest needs chosen"
}
},
/*errorPlacement: function(error, element) {
if(element.attr("id") == "interestHidden") {
error.html('#interestError');
} else {
//Placement for other interest Hidden
}
},*/
errorPlacement: function (error, element) {
if ($(element).attr('name') == 'interestHidden') {
// error.insertAfter($(element).next());
error.insertBefore(element.prev('#interestHidden'));
} else {
error.insertAfter(element); // <- default
}
},
submitHandler: function(form) {