How to stop jQuery .ajax() execution when success is false? - php

Question

I have this code which works.
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success: function(data) {
if(data == 'true')
alert("OK");
else
alert("not ok");
}
});
However I have some more code after that like:
var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone + '&message=' + message;
$.ajax({
type: "POST",
url: "bin/process.php",
data: dataString,
...
...
...etc
However, I need to stop the script when success:function(data) is false.
So, I thought that return false; should stop the execution
success: function(data) {
if(data == 'true') {
alert("OK");
} else {
alert("not ok");
return false;
}
}
, however it is not working and the code after $.ajax is executed anyway.
How to stop the script when the success is false?
Any advice? Thanks in advance.
ADDITIONAL INFO:
I have another ajax call which I want to execute when success is true:
var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone + '&message=' + message;
$.ajax({
type: "POST",
url: "bin/process.php",
data: dataString,
success: function() {
alert ('mail was sent OK');
}
});
How to execute this code only after success of the first ajax call?

Answer 1

Your extra code should be in the callback itself.
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success: function(data) {
if (data == 'true') {
alert("OK");
// more code
var dataString = 'name='+ name + '&email=' + email + '&phone=' + phone + '&message=' + message;
// ... second ajax call
} else {
alert("not ok");
}
}
});

Answer 2

You could also add async:false to your AJAX call. This way, the code after won't execute until the request has ended. return false won't do anything either, but you could set a flag in the success function.
var isOk = false;
$.ajax({
type: "GET",
async: false, // prevent the asynchronous call
url: "includes/process.php",
data: "captcha=" + captcha,
success: function(data) {
if (data.length) {
alert("OK");
isOk = true;
}
}
});
if (isOk) {
// do your stuff
}

Answer 3

You can
1) add your additional code to the callback success function
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success:function(data){
if(data=='true') {
alert("OK");
//continue here
var datastring = ...
}
else
alert("not ok");
}
});
2) change the ajax call to not be asynchronous by adding this option to the .ajax call
var isSuccess = false;
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success:function(data){
isSuccess = (data=='true');
},
async: false
});
Then you can set a var in your success function to tell the rest of your code whether to continue or not.

Answer 4

Since $.ajax() is asynchronous, code after that will execute anyway. You can put the code in success handler. That way, it'll run only if its successful.

Answer 5

AJAX is an asynchronous call (hence the first 'A'). This means that jQuery makes your request and then goes on about its business while waiting for the call to complete.

Answer 6

The code after $.ajax is usually executed before the success function, because the $.ajax call is asynchronous. If you keep it asyncronous, you cannot stop the execution of the other code. You can set in the success function value of a variable in the outer scope and use syncronous code. But maybe it's better to move it in a function, called by the success callback? Anyway, to get better answer, please post more code.

Answer 7

Try this:
$.ajax({
type: "GET",
url: "includes/process.php",
data: "captcha=" + captcha,
success: function(data) {
if (data.length) {
alert("OK");
doMoreStuff(data);
}
}
});
function doMoreStuff(data){
// Code here will only be executed if ajax call is successful.
}