Nikolius Lau
Nikolius Lau

Reputation: 673

document.form.submit() not working within jquery ajax call

I have a form that when I submit it will check for some validation through jQuery AJAX call.

My code is like this:

$("#myForm").submit(function(){
    .....
    .....
    .....
    .....
    .....

    $.ajax({
        type:"POST",
        url:"<?php echo base_url();?>bTransJual/formTambahJual/ajaxCekStockJual/",
        data:  { prdIdUkuId: dataArrPrIdUkuId, qty: dataArrQty},
        dataType : "json",            
        success: function(data){
           if(data.sukses){
              //validasi lolos
              document.frmTransJual.submit();                                             
           }else{
              //validasi gagal
              psnErrNya = data.psnErr;
              $("#psnNotifikasiAjax").html(psnErrNya);
              $("#notifikasiAjax").show('normal');
              $("#imgLoadSubmit").hide();                                       
              return false;
           }
        }
     });
});

And my form tag:

<form name="frmTransJual" id="myForm" method="post" action="some_url.php">

If the ajax success it will return a value data, and if this data.sukses is true I want the form to submit it. i use document.frmTransJual.submit(); to submit it, but it doesn't work. anybody have a solution for this?

Upvotes: 0

Views: 973

Answers (4)

StaticVariable
StaticVariable

Reputation: 5283

The reason is that you are using a infinite loop.It will call the same funciton again.

you can use like this

create a div

 `<div id="submit">Submit form</div>`


 $("#submit").click(function(){
$.ajax({
    type:"POST",
    url:"<?php echo base_url();?>bTransJual/formTambahJual/ajaxCekStockJual/",
    data:  { prdIdUkuId: dataArrPrIdUkuId, qty: dataArrQty},
    dataType : "json",            
    success: function(data){
       if(data.sukses){
         $("myform").submit();                                             
       }else{
          //validasi gagal
          psnErrNya = data.psnErr;
          $("#psnNotifikasiAjax").html(psnErrNya);
          $("#notifikasiAjax").show('normal');
          $("#imgLoadSubmit").hide();                                       
          return false;
       }
    }
 });

})

Upvotes: 1

gen_Eric
gen_Eric

Reputation: 227220

document.frmTransJual is the same form as $("#myForm"). So, calling document.frmTransJual.submit(); will just call the submit function again, in an infinite loop.

Upvotes: 1

Sushanth --
Sushanth --

Reputation: 55740

It is because the submit will not wait for the AJAX request to be completed.. It is asynchronous..

By the time the call comes out of callback function the request is long gone.

Upvotes: 0

user229044
user229044

Reputation: 239270

The "A" in "AJAX" is for "asynchronous". Your submit handler function returns long before your AJAX call is complete, returning false from the else branch of your AJAX callback cannot affect the return value your submit callback.

Upvotes: 0

Related Questions