Использование JQuery для одновременного проверки всех полей формы?

Question

Я написал свой собственный сценарий проверки jquery для проверки полей в форме (все они необходимы, но способ структурирования кода состоит в том, что поля проверяются один за другим и не все сразу (когда нажата кнопка отправки) .Отель код приведен ниже

$('#contactForm').submit(function() {  

     $(".error").remove(); 

var name = $("#name").val(); 
     var email = $('#email').val(); 
     var subject= $('#subject').val(); 
     var message = $('#message').val(); 

var hasError = false; 

var emailReg = /^[+a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/i; 
if(name == '') { 
     $("#name").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

else if(subject == '') { 
     $("#subject").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

else if(message == '') { 
     $("#message").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

    else if(!emailReg.test(email)) { 
     $("#email").after('<span class="error">Enter a valid email address.</span>'); 
     hasError = true; 
    } 

    else if(email == '') { 
     $("#email").after('<span class="error">Please enter your email address.</span>'); 
     hasError = true; 
    } 

Как изменить этот код, чтобы все поля получить проверены одновременно.

Я попробовать с помощью функции JQuery Validate, но по какой-то причине, когда Я использовал это, он столкнулся бы с другими элементами jquery с моей страницей, в результате получив форму, несмотря на наличие значений incrct

Answer 1

Изменить все else ifif's.

if(name == '') { 
     $("#name").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

if(subject == '') { 
     $("#subject").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

if(message == '') { 
     $("#message").after('<span class="error">This field is required.</span>'); 
     hasError = true; 
    } 

    if(!emailReg.test(email)) { 
     $("#email").after('<span class="error">Enter a valid email address.</span>'); 
     hasError = true; 
    } 

    if(email == '') { 
     $("#email").after('<span class="error">Please enter your email address.</span>'); 
     hasError = true; 
    } 

Answer 2

как fileds проверяются по-разному и сообщения пользователь получает разные, чтобы вы не можете проверить все поля на то же время, вместо Youcan полей группы, которые должны быть проверены с тем же algorhithm, например, посредством устанавливая тот же класс для них (это может быть notShouldBeBlank имени класса для всех входов, которые не должно быть пустыми):

$('#contactForm').submit(function() { 

    $.each($('#contactForm .notShouldBeBlank'), function() 
    { 
     if($(this).val() == ''){ 
      $(this).after('<span class="error">This field is required.</span>'); 
     } 
    }); 

    // Other groups validated here 
} 

Надеется, что это поможет!