Parsley.js - контейнер с ошибками изменений

Я хочу изменить расположение каждого сообщения об ошибке. Это отображает сообщение об ошибке в соответствующем <div class="errorBlock"></div>. Используя код документации, сообщение об ошибке отображается до элемента (ввода) и не отображается, как ожидалось. Любые идеи?

Согласно документации:

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-код:

ВХОД

<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>

CHECKBOX

<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>

ОТВЕТЫ

Ответ 1

Вы можете сделать это, перезаписав Параметры по умолчанию Parsley. (примечание: я говорю о последней версии [v2.0], которую я предлагаю вам использовать). Вы в основном хотите дать Parsley метод, который найдет контейнер .errorBlock на основе поля ввода. Он будет выглядеть примерно так:

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

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

И вот живой пример.

Примечание. Используя этот метод, вы не можете использовать атрибут parsley-validate, который предлагает Макранд. Вызов .parsley в вашей форме делает то же самое, за исключением того, что вы можете добавить к нему свои настраиваемые параметры. Кроме того, вам нужно префикс всех атрибутов parsley с помощью data-, поскольку они являются атрибутами данных (начиная с версии 2.0).

Ответ 2

попробуйте следующее:

parsley-error-container=".errorBlock"

Вы можете проверить этот атрибут в Документация Parsley

Ответ 4

В ответ на ответ @ahmad hussain вам также нужно поместить атрибут в вашу форму:

<form parsley-validate>