Форма jQuery Ajax отправляется только после двойного нажатия

Question

У меня есть форма, которая при отправке проверяет, действителен ли номер счета (через AJAX).

Если неверно, отображается сообщение об ошибке. Это работает нормально.

Если он действителен, он должен отправить форму. Отправляется, но только после двойного нажатия кнопки "Отправить".

$('#account_validation_form').on('submit', function(e){

    e.preventDefault();

    var payers_account = $("input[name='payers_account']").val();

  $.post('ajax.php', {payers_account:payers_account}, function(data){

  if(data === 'invalid'){
     $(".account_invalid_message").html("<p>Given Account Number is invalid</p>");
  }

  else if(data === 'valid'){
     $("#account_validation_form").unbind('submit').submit()
  }

  });

});

Я знаю, что что-то не так с вызовом e.preventDefault() там. Но это необходимо и не может быть помещено в AJAX Callback. Так, каково было бы решение для этого?

Answer 1

$('#submit_button_id').on('click', function(e)
{
    var payers_account = $("input[name='payers_account']").val();
    $.post('ajax.php',
    {
        payment_amount: payment_amount,
        payers_account: payers_account,
    }, function(data)
    {
        if (data === 'invalid')
        {
            $(".account_invalid_message").html("<p>Given Account Number is invalid</p>");
        }
        else if (data === 'valid')
        {
            $("#account_validation_form").submit();
        }
    });
});

используйте этот код и сделайте небольшое изменение в HTML, измените type="submit" на type="button" для вашей кнопки отправки

Answer 2

Попробуйте связать сообщение формы, чтобы отправить событие нажатия кнопки:

$('#submit_button_id').on('click', function(e){



    var payers_account = $("input[name='payers_account']").val();

  $.post('ajax.php', {payment_amount:payment_amount, payers_account:payers_account,}, function(data){

  if(data === 'invalid'){
     $(".account_invalid_message").html("<p>Given Account Number is invalid</p>");
  }

  else if(data === 'valid'){
     $("#account_validation_form").submit();
  }

  });

});