Page 1 of 1
ajax request inside fd.onsubmit() not working
Posted: 28 May 2018
by Alex
Hi,
I have an async request inside of an fd.onsubmit() function. Issue is that Mozilla based browsers (e.g. Firefox) are transmitting the form before the ajax response...
here is my example code
Code: Select all
fd.onsubmit(function (postURL,data) {
jQuery.ajax({
url: postURL,
method: "POST",
headers: {
"Accept": "application/json",
"Content-Type": "application/json"
},
data: JSON.stringify(data),
success: function(){
console.log("ok");
}
});
return true;
});
Do you have an idea how to handle it?
br, Alex
Re: ajax request inside fd.onsubmit() not working
Posted: 28 May 2018
by Nikita Kurguzov
Dear Alex,
Yes, that's what is expected to happen. You can either execute Async requests outside of onsubmit() event, or do it inside, but return false, and then activate fd.save().click() again, after the request is successfully resolved, and this time return true (after checking for the appropriate condition that the request has been executed).
Re: ajax request inside fd.onsubmit() not working
Posted: 28 May 2018
by Alex
you mean like this ?:
Code: Select all
fd.onsubmit(function (postURL,data) {
jQuery.ajax({
url: postURL,
method: "POST",
headers: {
"Accept": "application/json",
"Content-Type": "application/json"
},
data: JSON.stringify(data),
success: function(){
console.log("ok");
fd.save().click();
}
});
return false;
});
Re: ajax request inside fd.onsubmit() not working
Posted: 28 May 2018
by Nikita Kurguzov
Dear Alex,
Yes, try it like this:
Code: Select all
var success = false;
fd.onsubmit(function (postURL,data) {
jQuery.ajax({
url: postURL,
method: "POST",
headers: {
"Accept": "application/json",
"Content-Type": "application/json"
},
data: JSON.stringify(data),
success: function(){
console.log("ok");
success = true;
fd.save().click();
}
});
if (success)
return true;
return false;
});
This should work, but if it doesn't - let me know!
Re: ajax request inside fd.onsubmit() not working
Posted: 29 May 2018
by Alex
Hi Nikita,
thank you, it works. But the request is always being sent twice.
I guess the first click is the manual one and the second happens over fd.save().click();
How this could be handled?
br, Alex
Re: ajax request inside fd.onsubmit() not working
Posted: 29 May 2018
by Alex
I think, I got it with
Code: Select all
var success = false;
fd.onsubmit(function (postURL,data) {
if(!success){
jQuery.ajax({
url: postURL,
method: "POST",
headers: {
"Accept": "application/json",
"Content-Type": "application/json"
},
data: JSON.stringify(data),
success: function(){
console.log("ok");
success = true;
fd.save().click();
}
});
}
if (success)
return true;
return false;
});
br, Alex