我有两个文本框,电话号码#inputPh
和电子邮件#inputEm
。这些中的任何一个都是强制性的。我正在使用以下规则:
rules: {
inputPhone: {
required: {depends: function(){
if($("#inputEm").val()=="")//return value based on textbox1 status
return true;
else
return false;
}
},
isNum: true,
minlength: 10,
maxlength: 12
},
inputEmail: {
required: {depends: function(){
if($("#inputPh").val()=="")//return value based on textbox1 status
return true;
else
return false;
}
},
email: true
}
},
highlight: function(element) {
$(element).closest('.control-group').removeClass('success').addClass('error');
},
success: function(element) {
element.addClass('valid').closest('.control-group').removeClass('error').addClass('success');
}
验证工作正常,但问题是当表单以空字段提交时,两个文本框都将与错误类一起使用。之后,当我在其中一个文本框中输入有效值时,只有该particulor字段获得成功类,而另一个将具有错误类,即使可以提交表单。
如何通过jQuery Validator函数访问或传递依赖元素?
答案 0 :(得分:1)
相反,请使用the additional-methods.js
file中包含的require_from_group
方法。根据代码评论:
/*
* Lets you say "at least X inputs that match selector Y must be filled."
*
* The end result is that neither of these inputs:
*
* <input class="productinfo" name="partnumber">
* <input class="productinfo" name="description">
*
* ...will validate unless at least one of them is filled.
*
* partnumber: {require_from_group: [1,".productinfo"]},
* description: {require_from_group: [1,".productinfo"]}
*
*/
在其他字段上保留错误类没有任何问题...
$(document).ready(function() {
$('#myform').validate({
rules: {
inputPhone: {
require_from_group: [1, '.mygroup'],
// isNum: true, // <-- no such rule in this plugin
minlength: 10,
maxlength: 12
},
inputEmail: {
require_from_group: [1, '.mygroup'],
email: true
}
}
});
});
DEMO:http://jsfiddle.net/wWjWM/
或者,您可以使用groups
选项将两个字段的消息合并为一个标签。但是,这可能并不理想,因为它也适用于这两个领域的所有其他规则。
顺便说一句:additional-methods.js
文件中有各种电话号码规则,您可以使用这些规则代替minlength
和maxlength
。 (此插件中也没有isNum
这样的规则。它被称为digits
。)