how to push values to an array outside the loop from a nested ajax call with javascript

Question

I have a for loop which loops about 16 times and each time it loops i want a value to be pushed to the array i declared outside the loop and the array is pushed from a nested ajax call in the loop. i wrote an if condition that if the loop reaches 16 times it should alert all the contents of the array at once but i'm getting an empty value

var comment = [];
for (var i = 0; i < jsons.length; i++){
   var obj = jsons[i];
   if( i == jsons.length - 1 )
   {
       alert(comment);
       break;                       
   }
   var idno = '';
   idno = obj.IDNO;
   var amount = obj.AMOUNT;
   (function(i)
   {
        $.ajax({
            type: "POST",
            url: "../include/salprefix.php",
            data: {idnoauth: obj.IDNO, amount: amount, },
            dataType: 'json',
            cache: false,
            success: function(result){
                if(result[0].idno == '')
                {
                    alert(result[0].idno + " " + result[0].amount);

                }
                else if(result[0].idno != ''){
                    var idnoresult = result[0].idno;
                    var amountresult = result[0].amount;
                    $.ajax({
                        type: "POST",
                        url: "../include/salprefix.php",
                        data: {idnoinsert: idnoresult, amountinsert: amountresult},
                        cache: false,
                        success: function(gg){
                            if(gg != '')
                            {
                                comment[i] = gg;
                            }
                        }
                    });
                 }
            }
        });
    })(i);
}

the updated one is still not working as expected its returning an empty array

var comment = [];
            for (var i = 0; i < jsons.length; i++){
                //var comments = [];
                var obj = jsons[i];
                /*if (typeof obj.IDNO === 'string' && obj.IDNO.length)
                {
                    alert('good');
                }
                else{
                    alert('bad');
                }*/
                //alert(obj.REASON);
                //console.log(obj);

                //alert(obj.REASON);


                if( i == jsons.length - 1 )
                {
                    alert(comment);
                    break;                      
                }
                var idno = '';
                idno = obj.IDNO;
                var amount = obj.AMOUNT;
                var jqxhr1 = $.ajax({
                    type: "POST",
                    url: "../include/salprefix.php",
                    data: {idnoauth: obj.IDNO, amount: amount, },
                    dataType: 'json',
                    });

                var jqxhr2 = $.ajax({
                    type: "POST",
                    url: "../include/salprefix.php",
                    data: {idnoinsert: obj.IDNO, amountinsert: amount},
                    });

                $.when(jqxhr1, jqxhr2).then(function(result, gg) {
                    //alert(result[0].idno + " " + result[0].amount);
                    if(result[0].idno == ''/*&& result[0].amount == '' && result[0].idnoerror != ''*/)
                    {
                        alert(result[0].idno + " " + result[0].amount);
                        comments.push(result);


                    }
                    else if(result[0].idno != ''/* && result[0].amount != '' && result[0].idnoerror == ''*/){
                        var idnoresult = result[0].idno;
                        var amountresult = result[0].amount;
                        if(gg != '')
                        {
                            comment.push(gg);
                            /*if( i == jsons.length - 1 )
                            {*/
                                //alert(gg);
                                //alert(comments);
                                //break;
                            //}
                        }
                    }

                    //alert(idnoresult + " " + amountresult);
                    // Handle both XHR objects
                    //alert("all complete");
                });
                //})(i);
            }enter code here

Your loop runs, it makes ajax calls, which are async. You loop doesn't block until those calls complete.You loop finishes extremely quickly and not a single ajax call has completed, which will make your `comment` array to be empty. — JohanP, Feb 27 '17 at 04:46
embrace asynchronous coding - http://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call — Jaromanda X, Feb 27 '17 at 04:49
and now you'll have deprecation warnings in your developer tools console - you've avoided the problem — Jaromanda X, Feb 27 '17 at 04:51
No, don't do `async: false`. Structure your code to work with the asynchronous calls. Promises are your friend here... — nnnnnn, Feb 27 '17 at 04:52
You should look into `promise`. Here is a good example: http://stackoverflow.com/questions/3709597/wait-until-all-jquery-ajax-requests-are-done — JohanP, Feb 27 '17 at 04:52
this is kinda confusing now it was true i got a warning when i set the asyn to false but how do i implement the promise to my code — Joshua Akande, Feb 27 '17 at 05:05

how to push values to an array outside the loop from a nested ajax call with javascript

0 Answers0