Question

I am having trouble parsing the response from my app. Here is the call with my best guess at how to deal with the json coming back…

$.ajax({
  url: 'houses.json',
  method: 'GET',
  datatype: 'json',
  success: function (data) {
    $.each(data, function (h) {
      $(h).each(function () {
        console.log(h.address);
      });
    });
});

Here is the response I am getting back from the server:

[{
  "house": {
    "address": "7 view st dunedin nz",
    "lng": 170.500908,
    "id": 3,
    "lat": -45.875059
  }
}, {
  "house": {
    "address": "26 brown st dunedin nz",
    "lng": 170.496236,
    "lat": -45.875834,
  }
}]

the best I can get is having it say undefined. Once. I am trying to set up a loop for creating markers for a google map.
I could use another pair of eyes.
Anyone?
Thanks.

Answer 1

Since h is an array, you need to go down the property chain, h is a collection of house objects which have an address property, so change it a bit, like this:

   $.each(data, function(i, h){
     console.log(h.house.address);
   });

Make sure to remove that extra loop around it, no need since there’s only one array.

Here’s a visual way to think of it:

   h       h.house           h.house.address
 [ {       "house":{         "address":"7 view st dunedin nz".....