jQuery Ajax form only submits after clicking twice -

i have form when submitted checks if account number valid(through ajax).

if invalid, shows error message. working fine.

if valid, should submit form. submits but after clicking submit button twice.

$('#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 invalid</p>");   }    else if(data === 'valid'){      $("#account_validation_form").unbind('submit').submit()   }    });  }); 

i know wrong calling e.preventdefault() there. necessary , can't put inside ajax callback. solution ?

$('#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 invalid</p>");         }         else if (data === 'valid')         {             $("#account_validation_form").submit();         }     }); }); 

use code , little change on html change type="submit" type="button" submit button