javascript - JQuery Validator 插件验证条件

Question

我在使用验证器插件完全验证我的数据时遇到一些问题。
我有2个字段；字段一和字段二。然后我有 2 个 PHP 文件，process.php 和 processfailed.php。

现在我有很多条件。

如果 fieldOne 和 fieldTwo 均为空，我希望向用户显示错误，但不调用 PHP 文件。

如果其中一个字段具有有效数据，而另一个字段具有无效数据或为空，我希望它调用 process.php (我不希望发生验证错误事件)。

只有当两个字段都有无效数据时，我才希望在验证错误事件中调用 processfailed.php。

到目前为止我的代码是这样的(删除了一些部分以缩短它)

var validator = $("#my_form").validate({
    rules: {
        fieldOne: {
            require_from_group: [1, '.datagroup'],
            maxlength: 40
        },
        fieldTwo: {
            require_from_group: [1, '.datagroup'],
            minlength: 8
        }
    },
    groups: {
        datagroup: "fieldOne fieldTwo"
    },
    submitHandler: function (form) {
        $.ajax({
            type: "POST",
            url: "process.php",
            data: {
                'fieldOne': $("#fieldOne").val(),
                'fieldTwo': $("#fieldTwo").val()
            }
        })
        return false;
    },
    invalidHandler: function (form, validator) {
        /* Submit the form even if validation fails: */
        $.ajax({
            type: "POST",
            url: "processfailed.php",
            data: {
                'fieldOne': $("#fieldOne").val(),
                'fieldTwo': $("#fieldTwo").val()
            }
        })
        return false;
    }
});

关于它们都是空的，目前它向用户显示错误，但它似乎也在调用 processfailed.php (我不希望在这种情况下调用任何 php 文件)。

如果我向一个字段提供有效数据并将另一个字段留空，这似乎可行。

如果我向一个字段提供有效数据，而向另一个字段提供无效数据，这似乎在应该调用 process.php 时调用了 processfailed.php(只要一个字段有效就可以)。

如果我向两个字段提供无效数据(它们都未通过验证)，则 processfailed.php 似乎会按应有的方式调用。

那么我如何处理两个字段都为空(不调用任何 php 文件)以及如果一个字段有效而另一个字段无效则调用 process.php 而不是 processfailed.php。

任何建议表示赞赏。

Answer 1

对于两个字段都为空的第一个条件，您只需在 invalidHandler 方法中放置一个 if 语句即可。

为了在其中一个字段有效时不对另一个字段应用验证，您可以使用规则的 depends 属性。

$("#my_form").validate({
    rules: {
        fieldOne: {
            require_from_group: [1, '.datagroup'],
            maxlength: {
                param: 2,
                depends: function(element) {
                    var valTwo = $('#fieldTwo').val();
                    return !valTwo || (valTwo.length < 8);
                }
            }
        },
        fieldTwo: {
            require_from_group: [1, '.datagroup'],
            minlength: {
                param: 8,
                depends: function(element) {
                    var valOne = $('#fieldOne').val();
                    return !valOne || (valOne.length > 2);
                }                
            }
        }
    },
    submitHandler: function (form) {
        alert("process");
        return false;
    },
    invalidHandler: function (event, validator) {
        if ($('#fieldOne').val() || $('#fieldTwo').val()) {
            alert('processfailed');
        } else {
            alert('empty');
        }
        return false;
    }
});

jsfiddle

我删除了 groups 属性，因为它会导致所有消息显示在第一个字段旁边，而当消息出现时，这似乎不正确，因为第二个字段违反了 minlength 规则。

注意:invalidHandler函数的第一个参数是事件对象，而不是表单元素，但您可以使用event.target获取表单元素。