how can i push ajax response into array for each input class

Question

that is my code

var idList = [];
$('.savearray').each(function(index, element) {
  //idList.push($(element).val());
  var selectedbox = $(element).val();
  var store_num = document.getElementById("store").value;

  $.post( "classes/qetitemqty.php", { ID: selectedbox, store_num: store_num})
    .done(function( data ) {
      idList.push(data);
      //idList.push(JSON.parse(data));                          
    });
});


console.log(idList);

my array coming empty like this put have length with correct response

[]
  0: "1"
  1: "1" 
  length: 2__proto__: Array(0)

Possible duplicate of [Why is my variable unaltered after I modify it inside of a function? - Asynchronous code reference](https://stackoverflow.com/questions/23667086/why-is-my-variable-unaltered-after-i-modify-it-inside-of-a-function-asynchron). Read the `i` icon next to the array in the Chrome console; it says “Value below was evaluated just now”, i.e. when you open the array, _not_ when you log it. — Sebastian Simon, Nov 06 '19 at 15:14

score 0 · Answer 1 · answered Nov 06 '19 at 15:20

The console.log may always print an empty array, because the asynchronous call is inside the for loop and secondly by the time the response has arrived from this call, this line console.log(idList); have already executed. Also the asynchronous call may element may not be take element in same order as it will wait till the response has arrived and by then element will change to another value.

Also take this line var store_num = document.getElementById("store").value; outside the loop

For this try by creating an immediately invoking function expression and pass element as parameter

var idList = [];
var store_num = document.getElementById("store").value;
$('.savearray').each(function(index, element) {
  (function(x) {
    var selectedbox = $(x).val();
    $.post("classes/qetitemqty.php", {
        ID: selectedbox,
        store_num: store_num
      })
      .done(function(data) {
        idList.push(data)
      })
  }(element))

});

console.log(idList);

fefooo · Answer 2 · 2019-11-07T08:42:46.833

the above answers doesn't worked for me id do solve it by passing the array through map function like

    $(function() {
                    var data2 = $(".savearray").map(function() {
                    return $(this).val();}).get();
                    var obj2 = {};
                    for (var i = 0, l = data2.length; i < l; i++) {
                        obj2[data2[i].value] = data2[i].value;
                    }           

                    idList = [];
                    var store_num = document.getElementById("store").value;

                            $.post("classes/qetitemqty.php", {

                                store_num: store_num,
                                array: data2
                              })
                              .done(function(data) {
                                console.log(data.trim());
                              })


                })

and then do the loop into php for each like

foreach($array as $value){....}

then echo the response in my case its db query

thanks for all of your replay

how can i push ajax response into array for each input class

2 Answers2