Parsley.js - 更改错误容器

Question

我想改变每个错误消息的定位.这是在相应的显示错误消息<div class="errorBlock"></div>.通过使用文档的代码,错误消息msg显示在元素(输入)之前,并且不会按预期显示.有任何想法吗？

根据文件:

errors: {
    container: function (element, isRadioOrCheckbox) {
        var $container = element.parent().find(".parsley-container");
        if ($container.length === 0) {
            $container = $("<div class='parsley-container'></div>").insertBefore(element);
        }
        return $container;
    }
}

我的HTML代码是:

INPUT

<div class="input-group date date-picker" data-date-format="dd/mm/yyyy" data-date-viewmode="years">             
  <input class="form-control dataScrap firstInput" type="text" parsley-notblank="true" parsley-required="true" parsley-error-message="You must input a birth date" readonly="readonly"/>
  <span class="input-group-btn">
   <button class="btn default" type="button"><i class="fa fa-calendar"></i></button>
  </span>
  <div class="errorBlock"></div>
</div>

复选框

<div class="checkbox-list">
    <label class="checkbox-inline">
        <input type="checkbox" parsley-group="checkboxGroup" parsley-mincheck="2"> Checkbox 1
    </label>
    <label class="checkbox-inline">
        <input type="checkbox" parsley-group="checkboxGroup"> Checkbox 2
    </label>
    <div class="errorBlock"></div>
</div>

Answer 1

您可以通过覆盖Parsley的默认选项来完成此操作.(注意:我说的是最新版本[v2.0],我建议你使用)你基本上想给Parsley一个方法,.errorBlock根据输入字段找到容器.它看起来像这样:

var parsleyConfig = {
    errorsContainer: function(pEle) {
        var $err = pEle.$element.siblings('.errorBlock');
        return $err;
    }
}

$('#yourFormID').parsley(parsleyConfig);

而且这里有一个活生生的例子.

注意:使用此方法您无法使用parsley-validateMakrand建议的属性.调用.parsley您的表单会做同样的事情,除了您可以添加自定义选项.此外,您需要为所有欧芹属性添加前缀data-,因为它们是数据属性(从v2.0开始).

Answer 2

试试这个:

parsley-error-container=".errorBlock"

您可以在Parsley文档中检查此属性

Answer 3

Parsley API已更新。当前方法是：

data-parsley-errors-container="#your-div-id"

请参阅此处的文档：http : //parsleyjs.org/doc/index.html#psly-ui-for-field