Cannot set property of undefined angularjs

Question

I have a json object s.BdayDetails and i want to change the values of my s.BdayDetails.ProvID into another value.



 for(var i=0;i<s.BdayDetails.length;i++){


h.post("../Event/getProvinceName?ProvID=" + s.BdayDetails[i].ProvID).then(function (r) {

                s.BdayDetails[i].ProvID = r.data.toString();


            })

Returns an error Cannot set property 'ProvID' of undefined. But when I console.log(r.data.toString()) it shows the values.

It is s.BdayDetails[i].ProvID that is undefined. There's nothing to do with r. — holydragon, Nov 27 '18 at 06:46
It seems like you are doing multiple async AJAX request inside for loop. You should avoid multiple AJAX like this and write logic so that you can do the same with one AJAX call. — im_tsm, Nov 27 '18 at 06:48
When the async AJAX finishes the value of `i` is not available. — im_tsm, Nov 27 '18 at 06:49
send the entire `BdayDetails` to the server in a single AJAX and modify the required attributes on server. Then send back the result to client. — im_tsm, Nov 27 '18 at 06:52

score 1 · Accepted Answer · answered Nov 27 '18 at 07:01

You can try something like the below code to achieve the same as you described. Please check with this plunker link for the example code implementation.

Controller:

  var s ={
    BdayDetails: [{
      ProvID: '001',
      ProvName: 'KARNATAKA'
    },{
      ProvID: '002',
      ProvName: 'GOA'
    }]
  };
  var indx = 0;

  function nextProvince(){
    if(indx < s.BdayDetails.length){
      $http.post("../Event/getProvinceName?ProvID=" + s.BdayDetails[indx].ProvID).then(function (r) {
          s.BdayDetails[indx].ProvID = r.data.toString();
          indx++;
          nextProvince();
      });
    }else{
      indx=0;
    }
  }
  nextProvince();

score 0 · Answer 2 · answered Nov 27 '18 at 07:15

Try This.

This is called closure inside the loop.

for(var i=0;i<s.BdayDetails.length;i++){
   function(index){
        h.post("../Event/getProvinceName?ProvID=" + s.BdayDetails[i].ProvID).then(function (r) {
            s.BdayDetails[index].ProvID = r.data.toString();
        })
   })(i);
 }
}

Cannot set property of undefined angularjs

2 Answers2