使用 parsley.js 支持每个字段的多个自定义错误消息答案

【问题标题】：multiple custom error message support per field by using parsley.js使用 parsley.js 支持每个字段的多个自定义错误消息
【发布时间】：2015-05-10 18:21:02
【问题描述】：

我正在尝试使用 parsley.js 验证一个简单的表单，并且我是 parsley.js 的初学者。我想使用 window.ParsleyValidator.addValidator() 方法在一个自定义验证方法中显示多个错误消息。所以我以我的方式尝试过。

我创建的简单 html 表单

<html>
	<head>Custom Validation Parsley
		<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
		<script src="js/parsley.min.js"></script>
		<script src="js/my-validator-parsley.js"></script>
		
	</head>
	<body>
		<form class="cmxform" id="commentForm" method="get" action="">
		  <fieldset>
		    <legend>Please provide your name, email address (won't be published) and a comment</legend>
		   
		    <p>
		      <label for="cemail">E-Mail with custom method (required)</label>
		      <input id="cemail" name="checkEmail" data-parsley-checkEmail>
		    </p>
		   
		   
		    <p>
		      <input class="submit" type="submit" value="Submit">
		    </p>
		  </fieldset>
		</form>
		<script>
		$("#commentForm").parsley();
		</script>
	</body>
</html>

以及包含自定义验证方法的 javascript 文件

var errorMsg = "";
window.ParsleyValidator.addValidator('checkEmail', function(value) {
    console.log(value);
    if (value == "") {

      errorMsg = "this field must not be empty";

      return false;
    } else {
      var regex = /^([a-zA-Z0-9_.+-])+\@(([a-zA-Z0-9-])+\.)+([a-zA-Z0-9]{2,4})+$/;

      if (!regex.test(value)) {

        errorMsg = "this field must be email ***";
        

      }
      return regex.test(value);
      window.ParsleyValidator.addMessage('en', 'checkEmail',
        errorMsg);
    }

  }, 32)
  //.addMessage('en','checkEmail',window.ParsleyValidator.catalog)
;

但这对我不起作用。谁能给我关于这个以及如何处理这个任务的建议？

【问题讨论】：

标签： javascript jquery parsley.js

【解决方案1】：

在给定的语言环境中，您只能为每个约束分配一条消息。

来自http://parsleyjs.org/doc/annotated-source/validator.html：

addMessage: function (locale, name, message) {
  if ('undefined' === typeof this.catalog[locale])
    this.catalog[locale] = {};

  this.catalog[locale][name.toLowerCase()] = message;

  return this;
},

因此，如果您想要多条消息，请定义多个验证器。

还有，

如果您想要一个字段是必需的，则无需检查它是否为空；只需为其添加required 属性（例如<input ... required />）
Parsley 与常用验证器 (http://parsleyjs.org/doc/index.html#validators) 捆绑在一起，“电子邮件”就是其中之一；启用它添加属性type="email" 到您的输入（例如<input type="email" required />）

更新：

来自http://parsleyjs.org/doc/index.html#psly-ui-for-javascript：

window.ParsleyUI.updateError(parsleyInstance, name, message);
手动编辑错误消息。

此外，您可以通过直接将消息分配给catalog 而不是使用addMessage() 来设置验证器函数中的消息（请注意，验证器的名称应全部小写）：

window.ParsleyValidator.addValidator('checkEmail', function(value) {

    if (...)
        window.ParsleyValidator.catalog.en.checkemail = 'Some error message AAA';
    else
        window.ParsleyValidator.catalog.en.checkemail = 'Some error message BBB';

    return (...);

}, 32);

【讨论】：

因此我可以使用 parsley 简单地添加必需的和电子邮件。但我这样做的确切目的是使用 handlebar.js 和注册表扩展文件动态创建的表单，需要设置在表单中创建字段时的验证。这只是我正在制作概念证明，以显示每个验证器自定义方法可以通过 parsley.js 执行的支持多个错误消息。所以你能告诉我这是否可以通过 parsley。 js