web-dev-qa-db-ja.com

jQuery検証-エラーの配置

JQuery Validationの「errorPlacement」を使用しようとしています[〜#〜] docs [〜#〜]

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

エラーbeforeを無効な入力にしたいのですが、これは機能しません:

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

LIVE DEMO

助けていただければ幸いです!

31
Iladarsda

無効な要素の前にエラーメッセージを挿入するため、 insertBefore() を使用します。

errorPlacement: function(error, element) {
    error.insertBefore(element);
}
49

エラーを発生させたい部分を置くだけです

<label for="[your checkbox id]" generated="true" class="error"></label>

例:

<label><input type="checkbox" name="checkbox" id="checkbox" value="1" > Checkbox content</label>
<label for="checkbox" generated="true" class="error"></label>
16

別のオプションは...

  errorPlacement: function (error, element) {
    element.before(error);
  }
2
actionbin

Htmlテンプレートを使用して、次のように位置とスタイルを指定することをお勧めします。

<input name="patient_gender" required>
<label for="patient_gender" class="validation_error_message help-block"></label>

エラー配置のための上書き機能

$.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);
        }
    }
});
1