Question

我正在尝试使用jQuery Validate，我的一个要求是在通过向导用户界面时验证某些特定组。我似乎无法找到此功能的jQuery Validate文档，并且只能在线找到非常模糊的引用。

我的声明基本上就是这样;

form.validate({
                    groups: {
                        raceGroup: "race",
                        identityGroup: "name gender age"
                    },
                    rules: {
                        race: {
                            required: true,
                        },
                        gender: {
                            valueNotEquals: "Select Gender ...",
                            required: true
                        },
                        name: {
                            pattern: "^(?!.*[ ]{2})(?!.*[']{2})(?!.*[-]{2})(?:[a-zA-Z0-9 \p{L}'-]{3,64}$)$"
                        }
                    },
                    messages: {
                        race: {
                            required: "this is a required for your character."
                        },
                        name: {
                            pattern: "You have entered an invalid name."
                        },
                        gender: {
                            valueNotEquals: "You must select a valid gender.",
                            required: "You must select a valid gender."
                        }
                    }
                });

好的，所以我定义了这些小组......但是现在怎样了？如何检查组内的所有内容是否有效？（或无效）

Answer 1

groups: {
    raceGroup: "race",
    identityGroup: "name gender age"
},

“我如何检查组内的所有内容是否有效？（或无效）”

你没有。这不是groups选项的工作方式。

使用groups选项，您只需将多个错误消息组合成一个。示例：如果您有一组字段，每个字段都使用require_from_group规则（任何'一个或多个'字段外的字段是必需的），groups选项将确保只显示一条消息，而不是在每个输入旁边重复。

没有用于创建验证组的已定义选项或标准化设置。

如果你试图做一个阶梯形式，有各种方法。

当我创建多步骤表单时，我为每个部分使用一组唯一的<form>标记。然后我使用the .valid() method测试该部分，然后再移动到下一部分。 （不要忘记首先初始化插件;在DOM准备好的所有表单上调用.validate()。）

然后在最后一节，我在每个表单上使用.serialize()并将它们连接成一个要提交的数据查询字符串。

像这样......

$(document).ready(function() {

    $('#form1').validate({ // initialize form 1
        // rules
    });

    $('#gotoStep2').on('click', function() { // go to step 2
        if ($('#form1').valid()) {
            // code to reveal step 2 and hide step 1
        }
    });

    $('#form2').validate({ // initialize form 2
        // rules
    });

    $('#gotoStep3').on('click', function() { // go to step 3
        if ($('#form2').valid()) {
            // code to reveal step 3 and hide step 2
        }
    });

    $('#form3').validate({ // initialize form 3
        // rules,
        submitHandler: function (form) {
           // serialize and join data for all forms
           // ajax submit
           return false;
        }
    });

    // there is no third click handler since the plugin takes care of this with the
    // built-in submitHandler callback function on the last form.

});

重要的是要记住上面的click处理程序没有使用type="submit"按钮。这些是常规按钮，form代码的外部或type="button"。

只有最后一个表单上的按钮才是常规type="submit"按钮。那是因为我只在最后一种形式上利用插件的内置submitHandler回调函数。

“概念证明”DEMO：http://jsfiddle.net/N9UpD/

另外，请参阅参考：

https://stackoverflow.com/a/17975061/594235

jQuery Validate：验证特定组

1 个答案: