javascriptjqueryvalidation

jquery validation get all errors


For example I have form with 'firstname' field. I added two rules to this field (number, required). But when I submit form I see just one error. How I can see list of errors ('This field is required.' and 'Please enter a valid number.') ?

.error {
 font: normal 10px arial;
 padding: 3px;
 margin: 3px;
 background-color: #ffc;
 border: 1px solid #c00;
 }
body{font-size:x-large;background:#CCC;}
h1{margin-bottom:20px;}
form{padding:50px;}



$(document).ready(function(){
  $("#form").validate({ rules: {
    'firstname': {
          number: true,
          required: true,
      },
  }
 });});


<form id='form' name='form' method='post' action=''><p>
  <input type='text' name='firstname' id='firstname'/></p>
  <input type='submit' name='Submit' value='Submit'/></p>
</form>

http://jsfiddle.net/4tcsjwah/398/

Solution

  • pretty sure this will work, change it to meet your requirements though.

    var messages = {
            email: {
                required:"Email is required field. Please enter valid email address",
                email:"Please enter valid email address",
            }
        };
    
        $(function(){
            $("#test-form").validate({ 
                onfocusout:false,
                onkeyup:false,
                messages:messages
            });
        });
    

    Visit this JS Fiddle: http://jsfiddle.net/JcFYr/1/