Jqueryの妥当性チェックerrorPlacement/submitHandler

Question

jqueryの検証プラグインからの応答がフォームのフィールドボックスに配置されるようにjsを書き込むにはどうすればよいですか？ htmlフォームがどのように見える

：

<form class="cmxform" id="commentForm" method="POST" action=""> 
<p> 
<label for="cname">Name</label> 
<input id="cname" type="text" name="name" size="60" class="required" minlength="2" /> 
</p> 
<p> 
<label for="cemail">E-Mail</label> 
<input id="cemail" type="text" name="email" size="60" class="required email" /> 
</p> 
<p> 
<label for="curl">URL</label> 
<input id="curl" type="text" name="url" size="60" class="url" value="" /> 
</p> 
<p> 
<label for="ccomment">Your comment</label> 
<textarea id="ccomment" type="text" name="comment" cols="72" rows="8" class="required"></textarea> 
</p> 
<p> 
<div id="button2"><input class="submit" id="submit_btn" type="submit" value="Send Email"/></div> 
</p> 
</form> 

jsが現在、次のようになります。

<script> 
$(document).ready(function() { 
    $('#commentForm').validate({ 
     submitHandler: function(form) { 
      $.ajax({ 
       type: 'POST', 
       url: 'process.php', 
       data: $(this).serialize(), 
       success: function(returnedData) { 
        $('#commentForm').append(returnedData); 
       } 
      });   
      return false; 
     } 
    }); 
}); 
</script> 

適切なJSは、フォームフィールド入力値内errorPlacementを入れていただきましたか？そのため、誰かが自分のメールアドレスを入力しなかった場合、「このフィールドは必須です」というレスポンスが電子メールの入力値の中に表示されます。現在、入力後に返されます。ありがとうございました。

Answer 1

検証では、正確にこの目的のための機能であるオプションerrorPlacementが提供されています。私は（あなたが私のバージョンを動作させるためにjQueryのUIを含める必要があるだろう）あなたはjQueryのUIのpositionユーティリティを使用するために迅速にこれを書いた

：私も、このCSSを定義し

//in your $.validate options, add this 
    errorPlacement: function(error, element) { 
     error.insertAfter(element).position({ 
      my:'right top', 
      at:'right top', 
      of:element   
     }); 
    } 

注：

を

label.error { color: red; position:absolute; }​ 

は、ここでは、アクションでそれを参照してください：http://jsfiddle.net/ryleyb/Z64Tv/