html - 使用Parsley Js时在正确的div中显示错误消息的问题

Question

我正在使用Parsley.js执行一些前端自定义验证，效果很好。当出现错误时，它会显示在div的底部，但是我希望该错误显示在具有一类help-block 的范围内。 span类还保存来自后端代码的错误消息，该消息工作正常。

我想使用相同的跨度类来显示来自parsley.js自定义验证器的错误。

布局

 <div class="form-line registar2 move {{ $errors->has('kra') ? ' has-error' : '' }}" >
      <input id="kra" placeholder="KRA PIN Number *" type="text-area" class="form-input" name="kra" value="{{ old('kra') }}" maxlength="12" required data-parsley-kra = ''>
      <div class="check-label"></div>
      @if ($errors->has('kra'))
        <span class="help-block">
            <strong>{{ $errors->first('kra') }}</strong>
        </span>
      @endif
    </div>

Parsleyjs自定义验证器

window.Parsley.addValidator('kra', {
  validateString: function(value) {
    return true == (/[A-Z]\d{9,}[A-Z]$/.test(value));
  },
  messages: {
    en: 'Please insert a valid PIN number e.g <b> A123456789A </b>'
  }
});

Answer 1

设置data-parsley-errors-container允许您更改Parsley放置错误消息的位置。