Use variable outside the success function from an ajax/jquery call

Question

I have the following code

var test;

 $.ajax({
    type: "GET",
    url: "../views/person/controller.php?actor=person&action=checkAge",
    data: "age=" + value,
    success: function(msg){
        console.log(msg);
        test = msg; 
    },
});

Validate.fail(test);

Now the test var should give true of false like the console does say. But test var gives me undefined why?

Answer 1

 var test; // <-- (1) This code runs first  
 $.ajax({  // <-- (2) Then this runs  
    type: "GET",
    url: "../views/person/controller.php?actor=person&action=checkAge",
    data: "age=" + value,
    success: function(msg){
        console.log(msg); //<-- (4) Finally this is run. IF your request is a success 
        test = msg; 
    },
 });
 Validate.fail(test); // <-- (3) This runs third  

Look at the order in which the code runs. Your variable is simply not available at that point because it's running when the code is triggered via the callback

Answer 2

Probably because Validate.fail(test) occurs immediately after the asynchronous call. Remember it is ASYNCHRONOUS, meaning it executes parallel to javascript running on your page.

Answer 3

var test;
 $.ajax({
    type: "GET",
    async: false,
    url: "../views/person/controller.php?actor=person&action=checkAge",
    data: "age=" + value,
    success: function(msg){
        console.log(msg);
        test = msg; 
    },
});
Validate.fail(test);

//Make your ajax function synchronous, set the json parameter "async: false", so javascript has to wait until test is assigned a value.