Question

我正在使用jQuery验证插件验证表单（需要使用插件，因为我有其他需要插件的功能）。它包含以下字段：

phoneNumber firstName lastName city zip

当下列陈述之一为真时，该表格被视为有效：

phoneNumber有效
firstName lastName city全部有效
firstName lastName zip全部有效

我知道如何要求每个字段并使用其他验证方法（我甚至有自己的zip），但我试图找出一个优雅的解决方案来实现我上面描述的逻辑。自定义方法或验证组是处理此问题的最佳方法吗？

Answer 1

优雅在旁观者的眼中......

我建议制作一个自定义验证器来处理你遇到的三种情况。

我花了一些时间来了解Validate可以做什么......我想出了这个来验证我的表格。我使用对servlet的异步调用来进行用户名检查......但是你可以把你想要的东西放进去。

我发现了另一篇关于堆栈溢出的帖子，更详细地说明了制作自定义验证器...... 我特别喜欢这一行jQuery.validator.methods['date'].call(this,value,element)，因为您似乎可以在自定义代码中使用内置验证器。 jQuery Validate Plugin - How to create a simple custom rule?

这些是我在学习验证时使用的资源： http://www.ferdychristant.com/blog//articles/DOMM-7LZJN7 //详细说明如何真正使用验证的文章。 http://www.ferdychristant.com/blog//pages/jQuery%20validation%20code
http://randomactsofcoding.blogspot.com/2008/10/starting-with-jquery-how-to-write.html
http://docs.jquery.com/Plugins/Validation/Methods/required#dependency-expression

在http://docs.jquery.com/Plugins/Validation中只有一个惊人的信息深度...你只需要点击它就可以了！

下面的

您还会看到您可以将javascript直接放入规则部分。

$(document).ready(function() {

$("#EmailUserEditFormId").validate({

    debug: true, //this lets it hit firebug
    onkeyup:false, //keep the traffic down for my async call

    rules: {

        username: {
            required: (jQuery('input#username:disabled').length==1)?false:true, //example of JS in a rule
            usernameCheck: (jQuery('input#username:disabled').length==1)?false:true //example of a JS rule with a custom validator 
        }
    },

    messages: {
        username: {
            required: "Please enter a unique username.",
            usernameCheck: "Username is already in use. Choose another."
        }
    }

});

}）;

...这是我简单的自定义验证器。

jQuery.validator.addMethod('usernameCheck', function(username) {
var postURL = "CheckUsername";
$.ajax({
    cache: false,
    async: false,
    type: 'POST',
    data: 'username=' + username,
    datatype: 'xml',
    url: postURL,
    success: function(xml) {
        unique = (jQuery(xml).find('unique').text() == "true") ? true : false;
    }
});
return unique;

}，''）;

Answer 2

phoneNumberValid, firstNameValid, lastNameValid, cityValid, zipValid;
if ((phoneNumberValid) || (firstNameValid && lastNameValid && (cityValid || zipValid)) {
    //Form Is Valid
}

每个变量代表一个布尔值，您应在检查每个字段后设置它。

我认为这种复杂的检查不仅仅适用于jQuery验证插件。

Answer 3

 function formIsValid(){
   if(phoneNumberIsValid) { return true; }
   if(firstNameIsValid && lastNameIsValid) {
     return (cityIsValid || zipIsValid);
   }
   return false;
 }

如果你喜欢单行而不关心可读性：

return (phoneNumberIsValid || (firstNameIsValid && lastNameIsValid && (cityIsValid || zipIsValid)));

如果你有一个conditional pattern matching的插件，如果你已经习惯了这样的东西可能会更具可读性

return match([phoneNumberValid, firstNameValid, lastNameValid, cityValid, zipValid],
[true, _], true,
[_, true, true, true, _], true,
[_, true, true, _, true], true,
_, false);

jQuery验证优雅的条件逻辑

3 个答案: