How to get data from ajax.done()?

Question

I have the following function:

$.ajax({
    url: "../../getposts.php"
}).done(function(posts) { 
    var postsjson = $.parseJSON(posts);
});

How do I use the variable postsjson outside the .done() function, or how do I declare it global?

I can't pass it to another function, because I want to use the array later on, and not when the ajax is completed.

Answer 1

If you just define the variable outside of the ajax call:

var postsjson;

$.ajax({
    url: "../../getposts.php"
}).done(function(posts) { 
    postsjson = $.parseJSON(posts);
});

Then you can use it outside. Likewise, if you just leave of the var, it will declare it globally, but that is not recommended.

As pointed out by SLaks, you won't be able to immediately use the data you get from the AJAX call, you have you wait for the done function to be run before it will be initialized to anything useful.

Answer 2

The cool thing is that the promise returned from the Ajax function can be used in many different ways, here are some:

var XHR = $.ajax({
    url: "../../getposts.php"
});


function somethingElse() {
    XHR.done(function(posts) { 
       var postsjson = $.parseJSON(posts);
    });
}

--

function myAjax(url) {
    return $.ajax({
        url: url
    });
}

function doSomething(url) {
    var postsjson = myAjax(url).done(parsePosts);
}

function parsePosts() {
     return $.parseJSON(posts);
}

doSomething("../../getposts.php");

etc...

Answer 3

You need to declare a variable before calling ajax.

Simple Sample:

var postsjson;

$.ajax({
    url: "../../getposts.php"
}).done(function(posts) { 
    postsjson = $.parseJSON(posts);
});

console.info(postsjson); // Use here for example