jQuery验证 - 错误放置

Ila*_*sda 32 jquery jquery-validate

我正在尝试使用jQuery Validation DOCS中的 'errorPlacement' :

$("#myform").validate({
  errorPlacement: function(error, element) {
     error.appendTo( element.parent("td").next("td") );
   },
   debug:true
 })
Run Code Online (Sandbox Code Playgroud)

我想无效输入之前放置错误,但这不起作用:

$("#myform").validate({
      errorPlacement: function(error, element) {
         error.appendTo( element.parent("form").prev("input") );
       },
       debug:true
     })
Run Code Online (Sandbox Code Playgroud)

现场演示

任何帮助非常感谢!

Fré*_*idi 50

由于要在无效元素之前插入错误消息,请使用insertBefore():

errorPlacement: function(error, element) {
    error.insertBefore(element);
}
Run Code Online (Sandbox Code Playgroud)


小智 16

只需将部分放在您想要错误的位置即可

<label for="[your checkbox id]" generated="true" class="error"></label>
Run Code Online (Sandbox Code Playgroud)

例如:

<label><input type="checkbox" name="checkbox" id="checkbox" value="1" > Checkbox content</label>
<label for="checkbox" generated="true" class="error"></label>
Run Code Online (Sandbox Code Playgroud)


Yev*_*yev 6

我建议使用 html 模板来指定位置和样式,如下所示:

<input name="patient_gender" required>
<label for="patient_gender" class="validation_error_message help-block"></label>
Run Code Online (Sandbox Code Playgroud)

并覆盖错误放置函数

$.validator.setDefaults({
    errorPlacement: function(error, element) {
        var name = element.attr('name');
        var errorSelector = '.validation_error_message[for="' + name + '"]';
        var $element = $(errorSelector);
        if ($element.length) { 
            $(errorSelector).html(error.html());
        } else {
            error.insertAfter(element);
        }
    }
});
Run Code Online (Sandbox Code Playgroud)