Я использую последнюю версию плагина jQuery Validator вместе с jQuery (1.6.2).
У меня есть простая форма с необязательным полем для номера телефона, который называется Phone
.Следующий код работает безупречно, когда все поля «обязательны для заполнения».Сегодня проблема в том, что я добавил необязательное поле, и Validator, похоже, игнорирует правила для этого необязательного поля.
HTML:
<div id="contact">
<form id="contactForm" action="/cgi-bin/FormMail.pl" method="post">
<input type="hidden" name="subject" value="Contact Form" />
<input type="hidden" name="redirect" value="thankyou.html" />
<input type="hidden" name="required" value="Name,email,Comments" />
<input type="text" class="autoclear blur defaultInvalid" value="your full name" name="Name" /><br />
<input type="text" class="autoclear blur defaultInvalid" value="your email address" name="email" /><br />
<input type="text" class="autoclear blur defaultInvalid" value="your phone number" name="Phone" />
<fieldset id="radioset">
<input type="radio" id="radio-1" name="recipient" value="myEmail1@email.com" checked="checked" /><label for="radio-1">Label 1</label>
<input type="radio" id="radio-2" name="recipient" value="myEmail2@email.com" /><label for="radio-2">Label 2</label>
<input type="radio" id="radio-3" name="recipient" value="myEmail3@email.com" /><label for="radio-3">Label 3</label>
</fieldset>
<textarea class="autoclear blur defaultInvalid" name="Comments">your comments</textarea><br />
<input type="submit" value="Send Message" />
</form>
</div>
Я использую qTip2 дляукажите обязательные поля после проверки.
Все (технически) работает, оно проверяется и всплывающие подсказки qTip.
Вся проблема в том, что, несмотря на мои параметры, говорящие о том, что «Телефон» является необязательным, он продолжает помечать «Телефон» как требуется и выскакивает пустой qTip.Я знаю, что qTip2 здесь не проблема, потому что он просто ищет class="error"
.В DOM я вижу, что Валидатор применяет class="error"
к необязательному полю, несмотря на мои правила.
(я знаю, required: false
- это по умолчанию , но я все равно добавил это правило, потому чтоэтой проблемы. Это все еще игнорируется!)
Кто-нибудь может понять, почему он это делает?
jQuery / JavaScript:
$(document).ready(function() {
var nameMsg = "Please enter your full name.",
emailMsg = "Please enter your email address.",
emailMsgV = "This is not a valid email address.",
commentsMsg = "Please enter your comments.";
$('#contactForm').validate({
onkeyup: false,
validClass: 'valid',
rules: {
Name: {
required: true
},
email: {
required: true,
email: true
},
Phone: {
required: false
},
Comments: {
required: true
}
},
messages: {
Name: nameMsg,
email: {
defaultInvalid: emailMsg,
required: emailMsg,
email: emailMsgV
},
Comments: commentsMsg
},
success: function(error) {
setTimeout(function() { // Use a mini timeout to make sure the tooltip is rendred before hiding it
$('#contactForm').find('.valid').qtip('destroy');
}, 1);
},
submitHandler: function(form) {
form.submit();
},
errorPlacement: function(error, element) {
$(element).filter(':not(.valid)').qtip({ // Apply the tooltip only if it isn't valid
overwrite: false,
content: error,
position: {
my: 'bottom left',
at: 'top left',
viewport: $(window),
adjust: {
x: 25
}
},
show: {
event: false,
ready: true
},
hide: false
}).qtip('option', 'content.text', error);
} // closes errorPlacement
}) // closes validate()
}); // closes document.ready()