Pushing to Javascript Array from Jquery JSON request

Question

Why does this code always return 0?

     var possibleMatches = new Array();
  $.getJSON('getInformation.php', function(data) {
   $.each(data, function(i){
    possibleMatches.push(data[i]);
   })
  });
  alert(possibleMatches.length);

Though I can move or add "alert(possibleMatches.length);" inside the $.each and it will output the correct number of elements.

I'm just curious as to why it the values aren't going into the array as I expected. I'm sure its a local variable vs. global variable issue, just not sure why.

Basically, what this is trying to do is fill the possibleMatches array with the data results.

thanks!

Peter Bailey · Accepted Answer · 2010-03-09 17:05:27Z

6

Asynchronicity. The line alert(possibleMatches.length); executes before the success callback for $.getJSON() executes.

So, to have your alert report accurately, just move it.

var possibleMatches = new Array();
$.getJSON('getInformation.php', function(data) {
  $.each(data, function(i){
    possibleMatches.push(data[i]);
  })

  // To here
  alert(possibleMatches.length);
});
// From here

Remember, the first A in AJAX stands for "Asynchronous"

answered Mar 9, 2010 at 17:05

Peter Bailey

106k32 gold badges186 silver badges206 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

psiko.scweek Over a year ago

@Peter Bailey - Doh! How did I forget that little (but very important) part! That makes perfect sense! Thanks!

Andy E · Accepted Answer · 2010-03-09 17:05:49Z

2

$.getJSON performs an asynchronous call, whose callback is executed on completion of the xmlhttprequest used:

var possibleMatches = new Array(); 
$.getJSON('getInformation.php', function(data) {  // <-- this will run later 
    $.each(data, function(i){ 
        possibleMatches.push(data[i]); 
    }) 
}); 
alert(possibleMatches.length);  // this will call immediately

answered Mar 9, 2010 at 17:05

Andy E

346k86 gold badges482 silver badges452 bronze badges

Comments

Nick Craver · Accepted Answer · 2010-03-09 17:06:46Z

1

The jetJSON request is asynchronous, it finished after your alert runs. If you want an accruate alert, it should be in your callback for getJSON like this:

  $.getJSON('getInformation.php', function(data) {
   $.each(data, function(i){
    possibleMatches.push(data[i]);
   });
   alert(possibleMatches.length);
  });

answered Mar 9, 2010 at 17:06

Nick Craver

631k138 gold badges1.3k silver badges1.2k bronze badges

Collectives™ on Stack Overflow

Pushing to Javascript Array from Jquery JSON request

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related