Использование 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, но по какой-то причине, когда я использовал это, она конфликтовала с другими элементами jquery на моей странице, что приводило к отправке формы, несмотря на наличие некорректных значений

Answer 1

Изменить все else if на if'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

, поскольку файлы проверяются по-разному, а сообщения, которые получает пользователь, отличаются, вы не можете проверить все поля одновременно, вместо этого вы можете группировать поля, которые должны проверяться с одинаковым алгоритмом, например, установив для того же классаих (это может быть 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
}

Надеюсь, это поможет!