Blog Image

issue with submit form in ajax success response

Usually when we try to submit the form after ajax call on success response, the form does not’t get submitted.

Like for example in below code:-

$.ajax({
type : “POST”,
url : “to/some/url”,
data : {
userName:userName,
mobileNumber:mobileNumber,
otp:otp
},
dataType : “json”,
success : function(data)
{
if(data.result == true) {
jQuery(“#form_id”).submit();
}else {
return false;
}
}
});

Now why this occur. Since you are calling the submit function from the ajax response, you need to remove the “submit” handler before submitting the form again. I.E. You need to submit the form without doing the ajax call again. Refer below:-

$.ajax({
type : “POST”,
url : “to/some/url”,
data : {
userName:userName,
mobileNumber:mobileNumber,
otp:otp
},
dataType : “json”,
success : function(data)
{
if(data.result == true) {
// Submit this form without doing the ajax call again
jQuery(“#form_id”).unbind().submit();
}else {
return false;
}
}
});

 



Author: admin

Vinod Ram has been in Software Industry since 2006 and has experience of over 16 years in Software Development & Project Management domain specialised majorly in LAMP stack & Open Source Technology, building enterprise level Web based Application, Large Database driven and huge traffic Websites and Project Management. He loves to write information articles and blog to share his knowledge and experience with the outside world and help people to find solution for their problems.