1

我正在使用 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 ?
}

谢谢普拉萨德

4

2 回答 2

2

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

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

然后您可以使用.valid()方法来测试表单。

将它们分别放在专用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().each()请记住,如果选择器针对多个元素,则需要将它们包含在 jQuery中...

$('.ruleset1').each(function() {  // target multiple elements
    $(this).rules('add', {        // apply the rules to each
        required: true,
        ....
    });
});
于 2013-10-07T15:26:52.883 回答
0

我遇到了同样的问题,经过大量研究,我找到了解决方案。它包括使用 JQuery.extend 替换验证器设置中的规则属性。我创建了一个基于 @Sparky 的 jsfiddle。 http://jsfiddle.net/rWsLy/

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

var settings = $("#form1").validate().settings;

    // Modify validation settings
    $.extend(settings, {
        rules: {
            field1: {
                required: true,
            },
        },
    });

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

});

我更喜欢这种方式,因为规则的指定方式与 validate 方法相同。我还认为,以前的解决方案无法扩展。

于 2013-12-12T15:44:16.283 回答