使用parsley.js为每个字段提供多个自定义错误消息支持 [英] multiple custom error message support per field by using parsley.js
问题描述
我正在尝试使用parsley.js验证一个简单的表单，我在parsley.js.上非常初学。我想在一个自定义验证方法中使用window.ParsleyValidator.addValidator（）方法显示多个错误消息。所以我已经试过了。
我创建的简单html表格
< ; HTML> < head>自定义验证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> < /头> <身体GT; < form class =cmxformid =commentFormmethod =getaction => <字段集> < legend>请提供您的姓名，电子邮件地址（不会发布）和评论< / legend> < p为H. < label for =cemail>使用自定义方法的电子邮件（必填）< / label> < input id =cemailname =checkEmaildata-parsley-checkEmail> < / p为H. < p为H. < input class =submittype =submitvalue =Submit> < / p为H. < /字段集> < /形式> <脚本> $（ ＃commentForm）香菜（）。 < /脚本> < / body>< / html>
和javascript包含自定义验证方法的文件
var errorMsg =; window.ParsleyValidator.addValidator（'checkEmail'，function（value）{ console.log（value）; if（value ==）{errorMsg =此字段不能为空;返回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 email ***;} return regex.test（value）; window.ParsleyValidator.addMessage（'en'，'checkEmail'，errorMsg）;}}，32） // .addMessage（'en'，'checkEmail'，window.ParsleyValidator.catalog）;
但这对我不起作用。任何人都可以给予关于这个以及如何处理这个任务的建议？
在给定的语言环境中，每个约束只能分配一条消息。 / p>
来自 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;
返回此;
}，
因此，如果您需要多条消息，请定义多个验证器。
此外，
-
如果您想要一个字段，则无需检查它是否为空;只需添加
必需的属性（例如< input ... required />） -
Parsley与常用验证器捆绑在一起（ http：/ /parsleyjs.org/doc/index.html#validators ）和email就是其中之一;启用它为您的输入添加属性
type =email（例如< input type =emailrequired />）
更新：
来自< a href =http://parsleyjs.org/doc/index.html#psly-ui-for-javascript =nofollow> http://parsleyjs.org/doc/index.html#psly-ui- for-javascript ：
window.ParsleyUI.updateError（parsleyInstance，name，message）;
手动编辑错误消息。
此外，您可以通过直接将其分配给目录而不是使用 addMessage（）（请注意，验证器的名称应全部小写）：
window.ParsleyValidator.addValidator（'checkEmail'，function（value）{
if（...）
window.ParsleyValidator.catalog。 en.checkemail ='一些错误消息AAA';
else
window.ParsleyValidator.catalog.en.checkemail ='一些错误消息BBB';
return（... ）;
}，32）;
I am trying to validate a simple form using parsley.js and I am very beginner on parsley.js.I would like to show multiple error messages in one custom validation method using window.ParsleyValidator.addValidator() method.So I have tried out in my way.
Simple html form I have created
<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>
And the javascript file that is included the custom validation method
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)
;
But It's not working for me.Can anyone give me advice on this and how to approach this task?
You can only assign one message per constraint in a given locale.
From 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;
},
Thus if you want multiple messages, define multiple validators.
Also,
if you want a field to be required there's no need to check if it's empty; just add
requiredattribute to it (e.g.<input ... required />)Parsley is bundled with common validators (http://parsleyjs.org/doc/index.html#validators) and "email" is one of them; to enable it add attribute
type="email"to your input (e.g.<input type="email" required />)
UPDATE:
From http://parsleyjs.org/doc/index.html#psly-ui-for-javascript:
window.ParsleyUI.updateError(parsleyInstance, name, message);
Manually edit an error message.
Also, you can set the message from your validator function by directly assigning it to the catalog instead of using addMessage()(note that the name of the validator should be all lowercase):
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.js为每个字段提供多个自定义错误消息支持的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
