Sending a parsed array to processing

Question

I want to send an array of Integers from a php file named load.php to a JS script that will in turn send it to a Processing file written in js.

In the load.php i create the array i want to send and send it using json (the array consists of at least 40 Integers):

echo json_encode($varsArray);

In the main php file named game.php is the script:

<script language="JavaScript" type="text/javascript">
function js_GetArray() {
    $.get( "load.php", function( actiondata ) {
        var obj = JSON.parse(actiondata);
        return obj;
    });
}

Using this script i request the array from load.php (which I receive in json format), after receiving i parse it and send it back to the processing file.

In the Processing file I receive the array as such:

var objArr;
void setup(){
    objArr = js_GetArray();

}
void draw() {  
    alert(objArr[1]);
}

When activating the alert I receive the error:

Uncaught TypeError: Cannot read property '1' of undefined

How can I solve this and is there a better way to send the array?

Thank you.

@ClémentMalet That part was written manually to cut out all the other code before and after, it was written properly in the code itself and sends the error regardless. — Yuval Feldman, Sep 01 '14 at 15:17
The problem is that `$.get` is asynchromous, so it can't make `js_GetArray` return `obj`, because the callback function where you build `obj` will be executed later. — Oriol, Sep 01 '14 at 15:19
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) — Oriol, Sep 01 '14 at 15:25

score 1 · Answer 1 · answered Sep 01 '14 at 15:22

1

You're almost there. AJAX means "ASYNCHRONOUS Javascript and XML". That said, your draw function executes while the ajax call is still in progress. Thus, the objArr is still empty then.

Put call to draw in the callback:

<script language="JavaScript" type="text/javascript">
function js_GetArray() {
    $.get( "load.php", function( actiondata ) {
        var obj = JSON.parse(actiondata);
        // return obj; doesn't work!
        draw ( obj );
    });
}

void draw(objArr) {  
  alert(objArr[1]);
}

answered Sep 01 '14 at 15:22

Axel Amthor

10,980
1
25
44

Using the callback method does manage to send the array to the processing but like you said, it still goes through one draw loop in which it is undefined. - I might have misunderstood what you meant but adding the draw to the callback actually causes me to receive the undefined reply every time. – Yuval Feldman Sep 01 '14 at 16:17
Nicely explained. However, I *think* that `draw` is called by processing, so this won't work. – Luke H Sep 01 '14 at 18:15

Luke H · Accepted Answer · 2014-09-01T18:12:52.737

Your problem is twofold.

Your js_GetArray function doesn't actually return your data. You are actually returning the data from the callback passed to $.get, not from the js_GetArray function
Asynchronous execution is going to cause you problems. This is what happens in javascript commonly, is that you pass a callback function, which is called back later when the given process is finished. $.get has to make a request to a webserver and return the content. This can't happen instantly, so javascript calls you back with the results when it's done.

So, you are not getting the data until $.get calls the callback.

You need to do something like:

var objArr;

function js_GetArray(callback) {
    $.get( "load.php", function( actiondata ) {
        var obj = JSON.parse(actiondata);
        callback(obj);
    });
}

void setup(){
    js_GetArray(function(data) {
        objArray = data;
    });
}
void draw() {  
    alert(objArr[1]);
}

You may want to read about how asynchronous code works in javascript. Here's one article:

http://recurial.com/programming/understanding-callback-functions-in-javascript/

No comments to explain the downvote? Comments help us improve answers. — Luke H, Sep 01 '14 at 17:58

Sending a parsed array to processing

2 Answers2