ajax return true/false - I have implemented a callback
Your function validateUserDetails return no value, she just execute an asynchronous function. The asynchronous function return true or false, but nothing for catching it.
It's like this :
function validateUserDetails(){
// asynchronous function
$.ajax({...});
return undefined;
}
If you try console.log(trueOrFalse(bool));
you will see "true" or "false", but you can't use "return" into asynchronous function. You must do something into success function, who use "data" (log, or another function)
As noone has answered yet, I will:
First of all, you can try sync request
function validateUserDetails() {
var bool = false;
$.ajax({
url: 'response.php?type=validateUserDetails',
type: 'POST',
async: false,
dataType: 'json',
data: {name: $("#checkout_name").val(), email: $("#checkout_email").val(), "country": $("#checkout_country").val(), "city": $("#checkout_city").val()},
success: function(data) {
console.log(data); // this is currently returning FALSE
// Which is totally correct!
if (data == true) {
bool = true;
}
}
});
return trueOrFalse(bool);
}
If it is not acceptable, you can use $.Deferred()
function validateUserDetails() {
var deferred = $.Deferred();
var bool = false;
$.ajax({
url: 'response.php?type=validateUserDetails',
type: 'POST',
dataType: 'json',
data: {name: $("#checkout_name").val(), email: $("#checkout_email").val(), "country": $("#checkout_country").val(), "city": $("#checkout_city").val()},
success: function(data) {
console.log(data); // this is currently returning FALSE
// Which is totally correct!
if (data == true) {
bool = true;
}
}
complete: function () {
deferred.resolve(trueOrFalse(bool));
}
});
return deferred.promise();
}
function trueOrFalse(bool){
return bool;
}
function test() {
var promise = validateUserDetails();
promise.done(function(result) {
console.log("Bool: " + result);
});
}
ajax
request is asynchronous
. Don't use the sync: true
option, it's not really a good idea.
What you can do is to use the promise
that the ajax
returns, so:
function validateUserDetails(){
return $.ajax({
url: 'response.php?type=validateUserDetails',
type: 'POST',
async: false,
dataType: 'json',
data: {name: $("#checkout_name").val(), email: $("#checkout_email").val(), "country": $("#checkout_country").val(),
"city": $("#checkout_city").val()},
success: function(data){
console.log(data); // this is currently returning FALSE
}
});
}
$("#btn_go").on('click', function(){
validateUserDetails().done(function(data){
if(data == "someValue")
return "whatever you want";
});
});