I am fairly new to ajax and Javascript I have this code

duration_reco = $.ajax({
    url : newurl, 
    dataType : 'json'
}).done(function (obj) {});

console.log(duration_reco);

The output I get is I am interested in the responseJSON(last object in the snapshot). I have tried duration_reco.responsejSON, but it doesnt work. How can I get the vlue.

Edit

Just providing more code, so that you can help better

for(var i=1;i<=10;i++) 
{   
    duration_reco = $.ajax({
        url : newurl, 
        dataType : 'json'
    }).done(function (obj) {
        console.log(obj.data.duration); 
        //console.log(duration_reco.responseJSON());
        data[i - 1] = {
            "duration" : obj.data.duration
         };
     });
}

I tried to do something like this, but it seems neither 'i' nor 'data' is accessible inside. What are my other options

I am fairly new to ajax and Javascript I have this code

duration_reco = $.ajax({
    url : newurl, 
    dataType : 'json'
}).done(function (obj) {});

console.log(duration_reco);

The output I get is http://grab.by/v0lc I am interested in the responseJSON(last object in the snapshot). I have tried duration_reco.responsejSON, but it doesnt work. How can I get the vlue.

Edit

Just providing more code, so that you can help better

for(var i=1;i<=10;i++) 
{   
    duration_reco = $.ajax({
        url : newurl, 
        dataType : 'json'
    }).done(function (obj) {
        console.log(obj.data.duration); 
        //console.log(duration_reco.responseJSON());
        data[i - 1] = {
            "duration" : obj.data.duration
         };
     });
}

I tried to do something like this, but it seems neither 'i' nor 'data' is accessible inside. What are my other options

• javascript
• ajax
• json

• .done(function (obj) {console.log(duration_reco);}); – Kodr.F Commented Mar 10, 2014 at 14:14
• 1 See "How to return the response from an AJAX call?" – Jonathan Lonowski Commented Mar 10, 2014 at 14:14
• If you can provide more code (like, what do you want to do before and after this call) then someone (maybe me) will show you how to do it asynchronously and beautifully. Asynchronous is good. Provide more code. – Ziggy Commented Mar 10, 2014 at 14:31

3 Answers 3

Your Ajax request is being done asynchronously, while your code is being executed linearly. You need to log the output in the callback function.

var duration_reco = {};

$.ajax({
    url : newurl, 
    dataType : 'json'
}).done(function (obj) {
  duration_reco = obj;
  console.log(duration_reco);
});

You have access in the .done function where obj is the parameter.

}).done(function (obj) {
    //console.log(obj); //your response
});

In ments here and there throughout this question you have said things like "I want to make it synchronous" and "can I access it outside". You are encountering one of the very mon problems a learner will encounter when working with asynchronous code. You are exasperated because you want to write code like this:

1. set up the call
2. make the call
3. deal with the results

Asynchronous requests, you feel, are just getting in the way. Don't feel this way! Don't get frustrated: learn about the problem and then get even. Here is a link to a great resource that can help you tame asynchronous code.

Edit: using the sample code you provided, I've crafted a minimal example of how you would set this all up with promises. Check out the working fiddle.

// global variables: find a better way!
var data = [];
var count = 0;

// a function that returns a promise can be "waited for"
var many_requests = function () {
    var promise = $.Deferred();

    for(var i = 0; i < 10; i++) {   
        make_one_request(i, promise);
    }

    return promise; // "I promise one day I'll be an array of responses"
};

var make_one_request = function (index, promise) {

    $.ajax({
        url : '/echo/json/', 
        dataType : 'json',
        method: 'post', // <---- I'm making a POST because this is a fiddle
                        //       you will still use a GET
        data: {}, // <-- your data here
        success: function (response) {
            // these will run out of order, but your array will be ordered
            data[index] = response;
            console.log(index);

            // if the time has e, resolve the promise
            count++;
            if (count == 10) {
                promise.resolve(data); // OK! I'm an array of responses now!
            }
        }
    });
};

// I will wait until I have an array of response data
$.when(many_requests()).then( function (data) {

    // woo!
    console.log(data); 
});

In particular, pay attention to the console.log statement in the success function. The results are being returned out of order, but your array is still being indexed in the correct order. The callback to the then function will only run when the promise returned by many_requests is resolved.

Maybe this will work for you, maybe it won't, but the really important thing is: when you encounter a new kind of programming, a new pattern, or a new technique... don't try to run away and hide in your old paradigm! Embrace what is new and interesting, learn as much as you can, and then choose the techniques you love most and keep them in your tool belt.