How to access variable inside a block

Question

I have an AJAX request:

var foo = [],
parse = '';
$.ajax({
  type: "GET",
  url: "some/path/",
  data: somedata
}).done(function( data ){
  $.each(data.item, function(i, value){
    foo.push(value);
  });
  parse = foo.join(', ');
});

Now the string parse is the data that I want. How can I access that data? I tried showing it using alert(), but it's not displaying anything. I think this has to do with the variable scope.

How can I get that data?

where do you place the alert? also - within the debugger, do you see data in `data` variable? Also - this is not valid Javascript (you have errors) — Leon, Oct 30 '13 at 05:42
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) — Arun P Johny, Oct 30 '13 at 05:42
@joe it does not have any error. @leonid Yes. I does have data in it. And I try placing the `alert` outside the ajax call. But it seems it does not have any data. But when I tried placing `alert` inside `done` it does have the data I want. — Boy Pasmo, Oct 30 '13 at 05:46
You will either have to use a synchronous request, or use the callback function to execute the rest of your code. What's happening is that the `parse` variable doesn't have the data in it yet if you put the alert right after the request. You have to wait until you put data in the variable, then you call alert or whatever else you want to do. — Joe Simmons, Oct 30 '13 at 05:48
your ajax call is asynchronous so what happening here your code to display parse execute first and then parse is assigning the value so it is not working here if you want to keep it global then make ajax call sync by using this code 'async: false' — Sohil Desai, Oct 30 '13 at 06:01

jfriend00 · Accepted Answer · 2013-10-30T06:02:44.583

parse looks like a global variable so it will be available anywhere. The issue is probably when you're trying to access it. You can ONLY access parse in your .done() handler or some function you call from that.

The reason for this is that your ajax call is asynchronous. That means that the operation starts, the rest of your javascript continues to execute and then SOMETIME LATER the ajax call completes and ONLY then is the parse variable valid. Because of this, there really is no reason to declare the parse variable the way you have. You should just use its value inside the .done() handler.

This is asynchronous programming and works differently than synchronous, sequential programming. You must use asynchronous programming techniques with asynchronous ajax calls.

If you try to access parse inside the .done() handler and it's still empty in there, then the issue is likely that data.item isn't what you think it is and maybe isn't triggering the .each() loop and thus nothing is getting put into foo or parse. To debug this case, you should look at what exactly is in data and data.item.

This would be my suggestion:

$.ajax({
   type: "GET",
   url: "some/path/",
   data: somedata
}).done(function( data ){
   // no reason for these variables to be wider scope than here
   var foo = [], parse;

   $.each(data.item, function(i, value){
      foo.push(value);
   });
   parse = foo.join(', ');

   // look at parse here
   console.log(parse);

   // if parse still empty, then look at data and data.item here
   // to see what they are for debug reasons
   console.log(data);
   console.log(data.item);

   // now, you can use parse here
   callSomeFunction(parse);
});

How to access variable inside a block

1 Answers1

Linked