Question

I can’t push elements to works array. Console log is returning proper objects, but they won’t be pushed to the array… Here is my code:

var works = new Array();
    $(window).ready(function()
    {       

        $.getJSON('AJAX/getWorks.php', function(data) {
          $.each(data, function(key, val) {
             console.log(val);
             works.push(val);
          });
        });
        console.log(works);
    });

And the json object:

Object
date: "2012-04-08 17:53:58"
description: "sadasd"
id: "2"
link: "sadasd"
name: "dsad"
objects: null
position: "2"
__proto__: Object

Anybody see what I am doing wrong? Thanks in advance for answers…

Answer 1

You’re logging the array too early in your code. The console.log will run before the ajax request has finished because ajax is asynchronous.

    $.getJSON('AJAX/getWorks.php', function(data) {
              $.each(data, function(key, val) {
                 console.log(val);
                 works.push(val);
              });
              console.log(works); // move this here so the array is logged after the ajax request finishes. 
            });

EDIT

If you want to use that variable after the ajax request you can do the following

Create a function to house the ajax request

function getWorks() 
{
    return  $.getJSON('AJAX/getWorks.php', function(data) {
              $.each(data, function(key, val) {
                 works.push(val);
              }); 
} 

Then you can do the following to assure that the ajax request is complete.

 $.when( getWorks() ).then(function(){ 
     // you can access the array in here because the ajax has finished executing
 });