javascript - 带条件的 jquery 验证插件规则？

Question

我正在使用 Jquery 验证插件，我有一个带有“保存”、“提交”按钮的大表单。我有两个按钮的两组规则。

1. 每当用户单击保存按钮时，只有一组有效规则(必填字段电子邮件、密码)。
2. 每当用户点击保存按钮时只有有效的规则两组规则(所有必填字段)。

请问有没有人建议，如何开发这样的？

Set1 规则:

var rulesOne = { email : "required" .......}

Set2 规则:

var rulesTwo = {city : "required" ..........}

$("#form1").validate({
ignore : '*:not([name]),:hidden',
rules : rules});

如果保存按钮

if(this.id == "personal_save"){
  setOne rules test ?
else
// submit button (check all validations)
{
  setTwo rules test ?
}

谢谢普拉萨德

Answer 1

您不能使用此插件动态打开/关闭表单的任何/所有部分的验证。

但是，您可以使用 the .rules() method随时动态添加、删除或覆盖您的规则，为您提供类似的行为。

然后你可以使用the .valid() method测试表单。

将它们分别放入专用的 click 事件处理程序中。

$(document).ready(function() {

    // initialize the plugin
    $("#form1").validate({
        ignore : '*:not([name]),:hidden'
        // no rules; rules are set dynamically below
    });

    // Save Button
    $('#save_button').on('click', function() {

        // dynamically set the rules
        $('input[name="email"]').rules('add', {
            required: true,
            ....
        });

        // remove all rules from the other fields
        $('input[name="city"]').rules('remove');

        // force a test of the form
        $("#form1").valid();

    });

    // Submit Button
    $('#submit_button').on('click', function() {

        // dynamically set the rules
        $('input[name="city"]').rules('add', {
            required: true,
            ....
        });

        // remove all rules from the other fields
        $('input[name="email"]').rules('remove');

        // force a test of the form
        $("#form1").valid();

    });

});

概念验证演示:http://jsfiddle.net/x6YWM/

---

如果您有很多字段，您可以通过在它们上设置适当的类(如 .ruleset1 和 .ruleset2)来简化此操作。然后，您可以使用 .rules() 方法将它们作为一个组来定位。请记住，如果选择器针对多个元素，则需要将它们包含在 jQuery .each() 中...

$('.ruleset1').each(function() {  // target multiple elements
    $(this).rules('add', {        // apply the rules to each
        required: true,
        ....
    });
});