jquery - JQuery.Validate 添加带有消息的动态规则

Question

我有一个使用 jquery.validate 的表单。我最初使用一组规则和自定义消息调用验证...

$("#formName").validate( {
  rules: {
    myExistingInput: {
      required: true
    }
  },
  messages: {
    myExistingInput: {
      required: "Enter something"
    }
  },
  ignore: null, // include hidden fields (see below)
  submitHandler: function(form) {
    // do stuff
  },
  invalidHandler: function(event, validator) {
    // do stuff (some of the fields may have been hidden by a collapsible panel
    // if there is an error on one of those fields, expand the panel so the error
    // becomes visible)
  }
});

后来，我在表单中动态添加字段，并为这些字段添加规则......

$("#formName").append(...);

$("#newInputName").rules("add", {
  required: true,
  messages: {
    required: "Enter something else"
  }
});

如果我然后提交表单，我会从 jquery.validate 中收到一个错误...

检查元素 newInputName 时发生异常，检查“消息”方法。类型错误：无法获取未定义或空引用的属性“调用”

在浏览器中调试，我可以看到错误是从“检查”函数中抛出的，并且“方法”变量设置为“消息”。

如果我从对规则的调用中删除消息（“添加”，...

$("#newInputName").rules("add", {
  required: true
});

它按预期工作，但显然我现在没有自定义错误消息。

我在这里看到了很多关于 SO 的例子，表明我的语法是正确的。有什么建议么？

顺便说一句：jQuery 验证插件 - v1.11.0 - 2/4/2013

Answer 1

正如您发布的那样，您的代码似乎可以正常工作，没有错误。

准备好 DOM 的演示：http: //jsfiddle.net/UZTnE/

使用 PageInit 和 jQuery Mobile 进行演示：http: //jsfiddle.net/xJ3E2/

$(document).on("pageinit", function () {

    $('#myform').validate({ // initialize the plugin
        rules: {
            field1: {
                required: true
            }
        },
        messages: {
            field1: {
                required: "Enter something"
            }
        }
    });

    $('[name*="field"]').each(function () {
        $(this).rules('add', {
            required: true,
            messages: {
                required: "Enter something else"
            }
        });
    });

});

HTML：

<form id="myform">
    <input type="text" name="field1" />
    <input type="text" name="field2" />
    <input type="submit" />
</form>

顺便说一句：

这个...

ignore: null, // include hidden fields

应该...

ignore: [], // include hidden fields

请参阅： jQuery Validate - 启用隐藏字段验证

Answer 2

$(document).ready(function(){
  $("#controlId").rules("add", {
     required : true,
     messages : { required : 'field is required.' }
  });
});

Answer 3

作为对这个老问题的回答，我确实喜欢这样来获取规则对象中的信息。

添加规则后，您可以添加如下消息：

var inputRules = $('input').rules();
inputRules.messages = {required: 'your message'};

祝你好运！