2 раза происходит submit и валидация формы

Question

Столкнулся с такой проблемой - при такой конструкции почему-то дважды происходит сабмит и валидация формы.

$('.saveorderform').validate(
{
    rules: {
    },
    messages: {
    },
    errorPlacement: function (error, element) {
        if ($(error).text() != "") {
            alert($(error).text());
        }
    },

    success: function (label, element) {
    },

    submitHandler: function(e) {
      alert('Submit'); //2 раза!!!!!!!!!!!
    },
    errorClass: "invalid"
}
);


$(document).on('click', '.saveorderbtn', function() {
    $('.saveorderform').submit();
});

<button type="button" class="saveorderbtn">Save</button>

Подозреваю что сделал какую-то очевиднейшую ошибку, но не пойму где...

Спасибо за любую помощь!

Answer 1

e.preventDefault(); // отменяем стандартное поведение нажатия на кнопку

и вызываем submit формы в случае успешной валидации, я добавил в submitHandler

Вот как вариант

function validateForm() {
  const form = $('.saveorderform');

  form.validate({
      rules: {
      },
      messages: {
      },
      errorPlacement: function (error, element) {
        if ($(error).text() != "") {
          alert($(error).text());
        }
      },

      success: function (label, element) {
      },

      submitHandler: function (e) {
        form.submit();
        alert('Submit'); //2 раза!!!!!!!!!!!
      },
      errorClass: "invalid"
    }
  );
}


$(document).on('click', '.saveorderbtn', function (e) {
  e.preventDefault();
  validateForm();
});

БЛОГ НА HUSL

2 раза происходит submit и валидация формы

Ответы (1 шт):