Jquery form validation custom success размещение сообщений

Question

в моей форме проверки, сообщения об ошибках помещаются в поле ошибки. Но сообщения об успешности также появляются в том же окне. я хочу появляться сообщения об успешности рядом с моими полями форм, такими как error.appendTo(element.parent().next()); Мой текущий синтаксис похож на;

<script type="text/javascript"> 
$(document).ready(function() { 
    var validator = $("#testform").validate({ 
     rules: { 
      Field1: "required", 
      Field2: "required", 
      Field3: "required", 
      Field4: "required", 
     }, 
     messages: { 
      Field1: "Specify Field1", 
      Field2: "Specify Field2", 
      Field3: "Specify Field3", 
      Field4: "Specify Field4", 
     }, 
     errorPlacement: function(error, element) { 
       error.appendTo(element.parent().next()); 
     }, 
     success: function(label) { 
      label.html("OK").addClass("checked"); 
     } 
    }); 
}); 
</script> 
<form id="testform" name="testform" method="post" action="test.php"> 
<table> 
<tr> 
<td>Field1</td> 
<td> 
<input id="Field1" name="Field1" type="text"></td> 
<td class="status"></td> 
</tr> 
<tr> 
<td>Field2</td> 
<td> 
<input id="Field2" name="Field2" type="text"></td> 
<td class="status"></td> 
</tr> 
<tr> 
<td>Field3</td> 
<td> 
<input id="Field3" name="Field3" type="text"></td> 
<td class="status"></td> 
</tr> 
<tr> 
<td>Field4</td> 
<td> 
<input id="Field4" name="Field4" type="text"></td> 
<td class="status"></td> 
</tr> 
</table> 
</form> 

и стиль;

#testform label.error { 
    background:url("unchecked.png") no-repeat 0px 0px; 
    padding-left: 16px; 
    padding-bottom: 2px; 
    color: #CC0000; 
} 

#testform label.checked { 
    background:url("checked.png") no-repeat 0px 0px; 
    padding-left: 16px; 
    padding-bottom: 2px; 
    color: #008000; 
} 

Каковы изменения, которые я должен внести в свой синтаксис?

Я использую bassistance.de «Remember The Milk» в качестве шаблона. Вы можете посмотреть here.

Заранее спасибо .. :)

blasteralfred

Answer 1

Может быть, вы можете проверить класс элемента, чтобы увидеть, если вы собираетесь разместить сообщение об ошибке или сообщение об успешном выполнении:

errorPlacement: function(error, element) { 
    var container; 
    if (element.hasClass("valid")) { 
     container = element.parent().next(); 
    } else { 
     container = $("#errorbox"); 
    } 
    error.appendTo(container); 
},