JSON return value to global variable

Question

Simply my code looks like this:

 var thevariable = 0;

For(){
//somecode using thevariable
$.getJSON('',{},function(e){
//success and i want to set the returned value from php to my variable to use it in the forloop

thevariable = e.result;
});
}

my main problem that the variable value stays "0", during the whole For loop, while i only want it to be "0" at the first loop, then it takes the result returned from PHP to use it on for loop.

here it my real code if you need to take a look:

var orderinvoice = 0;
for(var i=0; i<table.rows.length; i++){
                            var ordername = table.rows[i].cells[5].innerText;
                            var orderqty = ((table.rows[i].cells[1].innerText).replace(/\,/g,'')).replace(/Qty /g,'');
                            var orderprice = (table.rows[i].cells[2].innerText).replace(/\$/g,'');
                            var ordertype = table.rows[i].cells[3].innerText;
                            var orderlink = table.rows[i].cells[4].innerText;

      $.getJSON('orderprocess.php', {'invoice': orderinvoice, 'pay_email': email, 'ord_name': ordername, 'ord_qty': orderqty, 'ord_price': orderprice, 'ord_type': ordertype, 'ord_link': orderlink}, function(e) {
          console.log();
          document.getElementById("result").innerText= document.getElementById("result").innerText + "Order #"+e.result+" Created Successfully ";
         document.getElementById("invoker").innerText = ""+e.invoice;
         orderinvoice = e.invoice;

          if(i+1 == table.rows.length){
            document.getElementById("result").innerText= document.getElementById("result").innerText + "With invoice #" + e.invoice;
          }
 });

The for loop does not wait until your **asynchronous** Ajax call received the response. You cannot use a loop here. Please see http://stackoverflow.com/q/23667086/218196 . — Felix Kling, Aug 01 '15 at 03:40
Do some research on what "asynchronous" means and then you might have a better idea why your `for` runs to completion before the first asynchronous response is even done. — jfriend00, Aug 01 '15 at 04:14

score 1 · Accepted Answer · answered Aug 01 '15 at 04:07

in a loop block, before one ajax complete other one will be run and this's javascript natural treatment. For your case you can call a function at the end of success event. Do something like this:

var i = 0;    
doSt();

function doSt() {
    var orderinvoice = 0;

        var ordername = table.rows[i].cells[5].innerText;
        var orderqty = ((table.rows[i].cells[1].innerText).replace(/\,/g, '')).replace(/Qty /g, '');
        var orderprice = (table.rows[i].cells[2].innerText).replace(/\$/g, '');
        var ordertype = table.rows[i].cells[3].innerText;
        var orderlink = table.rows[i].cells[4].innerText;

        $.getJSON('orderprocess.php', { 'invoice': orderinvoice, 'pay_email': email, 'ord_name': ordername, 'ord_qty': orderqty, 'ord_price': orderprice, 'ord_type': ordertype, 'ord_link': orderlink }, function(e) {
            console.log();
            document.getElementById("result").innerText = document.getElementById("result").innerText + "Order #" + e.result + " Created Successfully ";
            document.getElementById("invoker").innerText = "" + e.invoice;
            orderinvoice = e.invoice;

            if (i + 1 == table.rows.length) {
                document.getElementById("result").innerText = document.getElementById("result").innerText + "With invoice #" + e.invoice;
            }
            i++;
            if (i < table.rows.length) doSt();
        });
    }

score 1 · Answer 2 · answered Aug 01 '15 at 04:57

I think you need a recursive function that always deals with the first element in your rows array and then splices it off and calls itself. For example, something like this:

function getStuff(rows, results) {
    if (rows.length > 0) {
        var ordername = rows[0].cells[5].innerText;

        $.getJSON('orderprocess.php', { 'ord_name': ordername }, function (e) {
            // do some stuff
            results.push('aggregate some things here?');
            rows.splice(0, 1);
            return getStuff(rows, results);
        });
    } else {
        return results;
    }
}

When the array is spent, results will be returned with whatever aggregate you wanted at the end of the cycle. Then, you can do as you please with the results. I think you can also manipulate the DOM inside the function as you see fit if that makes more sense. Hope this helps.

JSON return value to global variable

2 Answers2