Accessing JSON string Outside of Jquery Ajax Call

Question

I am wondering is these is any way to access the results of a jquery ajax call in the form a traditional var set to function fashion. For example consider:

function getPoints(){
        //An array of JSON objects
        var Points;

        $.ajax({
          url: "js/retrievePointsDataJson.php",
          dataType:'json',
          type: 'POST',
        }).done(function(data){
            //console.log(data);
            Points.append(data);
        });

        console.log(Points);
        return Points;
    }

The commented out console.log show the array of json objects whereas the outer one does not. Now, i have tries this:

var Points = $.ajax({ ...});

And i see the response text within a larger object, but am unsure how to access the responseText. console.log(Points.responseText) yields an undefined variable. Is this possible with this approach? Here is another question that received a check mark with a similar issue.

I have another solutions, which is the encapsulate my code within the done() function and i will have access to all my data. I was just curious if what i am attempting to do is even doable.

Thank you.

possible duplicate of [How to return the response from an AJAX call?](http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-ajax-call) — adeneo, Jan 09 '14 at 21:37

Kevin B · Accepted Answer · 2014-01-09T22:44:23.697

yes it is possible, however, you must wait for the request to be complete before doing so. However, since you can't effectively force the return to wait until the data exists, you're only options are to return a deferred object instead, or re-write the function in such a way that allows it to accept a callback.

function getPoints(){
    return $.ajax({
      url: "js/retrievePointsDataJson.php",
      dataType:'json',
      type: 'POST'
    });
}
getPoints().done(function(data){
    console.log(data);
});

or

function getPoints(callback){
    return $.ajax({
      url: "js/retrievePointsDataJson.php",
      dataType:'json',
      type: 'POST',
      success: callback
    });
}
getPoints(function(data){
    console.log(data);
});

score 1 · Answer 2 · answered Jan 09 '14 at 21:45

Because the Ajax call is done asynchronously you shouldn't return it from the outside function. This would require that you somehow block until the asynchronous call completes. Instead you could pass in a callback function to the getPoints function that will handle the logic of using the points.

function getPoints(callback){
    $.ajax({
        url: "js/retrievePointsDataJson.php",
        dataType:'json',
        type: 'POST',
    }).done(function(data){
        callback(data);
    });
}

The asynchronous nature of ajax can make things harder if your used to imperative programming, but it will make your user interface much more responsive.

This is nice. Is this considered a promise? – Jim22150 Dec 12 '16 at 01:29 — Jim22150, Dec 12 '16 at 01:29

score 0 · Answer 3 · answered Jan 09 '14 at 21:37

The log you're calling in the outer function is working with an undefined variable because the function is asynchronous. You can't return it from getPoints because it won't have finished. Any work with the Points variable needs to happen inside the callback (the function passed to done).

Accessing JSON string Outside of Jquery Ajax Call

3 Answers3