使用Parsley.js ,是有可能指定应保持的错误消息的元素? 我试过了:
$('#myForm').parsley({
errors: {
container: {
$('#errorMessages')
}
}
});
但是,错误消息仍然是我的表单输入后立即放置。
使用Parsley.js ,是有可能指定应保持的错误消息的元素? 我试过了:
$('#myForm').parsley({
errors: {
container: {
$('#errorMessages')
}
}
});
但是,错误消息仍然是我的表单输入后立即放置。
我已经添加了另一个数据 - 属性数据香菜-错误容器=“#元素”,可以直接让你在DOM到指定的错误信息将被显示。
更多资讯: http://parsleyjs.org/doc/index.html#ui-for-field
最好
我从装有容器的关键函数返回真 。
我的HTML元素
<input type="text" class="input-small" errorSpan="yyy" id="ddd" name="ddd" value="" data-required="true">
<span id="yyy"></span>
使用Javascript
$('#abc').parsley({
errors: {
classHandler: function ( elem ) {}
, container: function ( elem, template, isRadioOrCheckbox ) {
//here i have span msg. id to be displayed as custom attribute in input element
$('#' + $(elem).attr('errorSpan')).html(template);
return true;//returning back boolean makes it work
}
, errorsWrapper: '<ul></ul>'
, errorElem: '<li></li>'
}
});
它也可以,如果我回
return $('#' + $(elem).attr('errorSpan')).html(template);
希望这可以帮助......
你需要使用一个回调函数来进行
这里一个简单的例子来的错误信息附加到元件父例如。
$('#myForm').parsley({
errors: {
container: function ( elem ) {
return $( elem ).parent();
}
}
});
编辑:在1.1.10-dev的工作,我改变来定义像上面的错误,容器的方式。 小心,这是一个BC中断;
data-parsley-errors-container="#your-div-id"
为我工作
<div class="form-group">
<label for="middle-name" class="control-label col-md-3 col-sm-3 col-xs-12">Start Time</label>
<div class="col-md-6 col-sm-6 col-xs-12">
<div class=" datetimepicker3 input-append timepick">
<input class="form-control" data-format="hh:mm" placeholder="HH:MM" type="text" name="startTime" data-parsley-errors-container="#startTimeErrorContainer" required="required" id="startTime" />
<span class="add-on"><i class="fa fa-clock-o icon-time"></i></span>
</div>
<div id="startTimeErrorContainer"></div>
</div>
@guillaumepotier我已经尝试在jquerymobile代码,我不会在屏幕上显示的任何错误信息的显示。 我要添加错误消息类“的帮助,内联”
的index.html
<script src="js/vendor/parsley.message.th.js"></script>
<script src="js/vendor/parsley.extend.min.js"></script>
<script src="js/vendor/parsley.min.js"></script>
...
<div class="control-group">
<label class="control-label" for="A0_C1">From<i class="required-icon"></i></label>
<div class="controls">
<input type="text" id="A0_C1" name="A0_C1" value="" required="required" />
<span class="help-inline"></span>
</div>
</div>
parsley.message.th.js
window.ParsleyConfig = $.extend( true, {}, window.ParsleyConfig, {
errors: {
container: function ( elem ) {
return $(elem).parent().find(".help-inline");
}
}
});
UPDATE -对工作的解决方案V1.1.9-dev的
return $(elem).closest('.controls').find('.help-inline').append(template);
只要定义香菜库导入之前 classHandler功能,在我的情况,我使用的引导和它的适用错误和有效类的父DIV(它有“形组”级)。
<script>
window.ParsleyConfig = {
classHandler: function ( parsleyField) {
// specify where parsley error-success classes will be set
return parsleyField.$element.parent();
// Change this to change the element to apply too
},
};
</script>
现在只需添加数据,香菜验证你的表单标签:
<form method="post" id="form1" data-parsley-validate>
当使用引导程序,你需要太指定引导错误和有效类
<form method="post" id="form1" data-parsley-error-class="has-error" data-parsley-success-class="has-success" data-parsley-validate>
为了得到“有错误”级上无效/错误状态父格设置(同为有效的太):
<div class="form-group has-error">
<label>Name</label>
<input class="form-control" type="text" id="name" name="name" required="" data-parsley-trigger="keyup" data-parsley-minlength="5">
<p class="help-block">Example help text here.</p>
</div>
该解决方案的全球所有领域。