JQuery Valide los mensajes de error personalizados en varios lugares (parte superior del formulario y en el nivel del formulario)
Estoy utilizando el complemento JQuery Validate para manejar la validación de mis formularios. Tengo el requisito de tener el error en 2 lugares:
Parte superior del formularioA nivel de campoLo tengo trabajando a nivel de campo, pero ¿cómo puedo hacer que funcione tanto para el nivel superior como para el de campo?
En la parte superior del formulario, quiero tener algo como esto:
<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>
En el nivel de formulario, tengo mensajes de error que se muestran como este que está funcionando:
First Name
This is a required field
[ ]
Last Name
This is a required field
[ ]
Email
This is a required field
[ ]
Aquí está el 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 mensajes de error colocados en el nivel de formulario:
$("#myform").validate({
rules: {
firstname: {
required: true
},
lastname: {
required: true
},
email: {
required: true
}
},
errorPlacement: function(error, element) {
error.insertBefore(element);
}
});
Entonces, ¿cómo puedo construir el código para tenerlo en ambas ubicaciones?
Gracias saludos