Jquery.Validate mensaje de error en la parte superior del formulario

Question

Me preguntaba cómo mostrar un solo mensaje de error encima del formulario en lugar de mensajes de campo individuales. como esta forma tiene http://jquery.bassistance.de/validate/demo/marketo/step2.htm

sé que tiene algo que ver con asas, pero no exactamente seguro de cómo o dónde ponerlos

<script> 
    $(document).ready(function(){ 
    $("#valform").validate(); 
    }); 
    </script> 

este es el código que tengo que utiliza toda la validación por defecto

Answer 1

Debe usar invalidHandler para esta funcionalidad. Algo como esto debería hacer:

$("#myform").validate({ 
    invalidHandler: function(form, validator) { 
     var errors = validator.numberOfInvalids(); 

     if (errors) { 
      $("#error-message").show().text("You missed " + errors + " field(s)"); 
     } else { 
      $("#error-message").hide(); 
     } 
    } 
}); 

Ejemplo:http://jsfiddle.net/KheRr/1/

Si desea ocultar los mensajes de error por defecto, debe especificar "" como mensaje de error para el campo y la validación de tipo:

$("#myform").validate({ 
    invalidHandler: function(form, validator) { 
     var errors = validator.numberOfInvalids(); 

     if (errors) { 
      $("#error-message").show().text("You missed " + errors + " field(s)"); 
     } else { 
      $("#error-message").hide(); 
     } 
    }, 
    messages: { 
     field1: { 
      required: "" // You'll have to do this for each field and validation type. 
     } 
    } 
}); 

Ejemplo:http://jsfiddle.net/KheRr/2/