JQuery Validar mensagens de erro personalizadas em vários locais (parte superior do formulário e no nível do formulário)
Eu estou usando o plugin JQuery Validate para lidar com a validação de meus formulários. Eu tenho um requisito para ter o erro em 2 lugares:
Topo da formaNo nível do campoEu tenho que trabalhar no nível do campo, mas como faço para que funcione tanto no nível superior quanto no nível do campo.
No topo do formulário, quero ter algo assim:
<p>You have the following error messages:</p>
<li>First Name - This is a required field</li>
<li>Last Name - This a required field</li>
<li>Email Address - This is a required field</li>
No nível do formulário, tenho mensagens de erro aparecendo como esta que está funcionando:
First Name
This is a required field
[ ]
Last Name
This is a required field
[ ]
Email
This is a required field
[ ]
Aqui está o código HTML
<html>
<body>
<div id="errormessages"></div>
<form id="myform">
<label for="firstname" class="required">First name</label> <input type="text" required="required" name="firstname" id="firstname" class="textInput" /></div>
<label for="lastname" class="required">Last name</label> <input type="text" required="required" name="lastname" id="lastname" class="textInput" /></div>
<label for="email" class="required">Email</label> <input type="text" required="required" name="email" id="email" class="textInput" /></div>
</form>
</body>
<html>
Código JQuery para mensagens de erro colocadas no nível do formulário:
$("#myform").validate({
rules: {
firstname: {
required: true
},
lastname: {
required: true
},
email: {
required: true
}
},
errorPlacement: function(error, element) {
error.insertBefore(element);
}
});
Então, como eu iria construir o código para tê-lo em ambos os locais?
Obrigado Felicidades