reading in jSON data with javascript

Question

Trying to read in some information from the google maps api into my application with JS. But havent quiet got my head around accessing the information in the returned jSON object. My JS is...

        var site = "./maps/scripts/reverseGeocode/locale.php";
        var params = "lat="+lat+"&"+"lng="+lng;

        var object = system.functions().ajax(site, params);

            var result = object.address_components[0];

          alert(result);

The jSON object is as follows...

  {
    "results" : [
      {
     "address_components" : [
        {
           "long_name" : "24",
           "short_name" : "24",
           "types" : [ "street_number" ]
        },
        {
           "long_name" : "Carabella St",
           "short_name" : "Carabella St",
           "types" : [ "route" ]
        },
        {
           "long_name" : "Kirribilli",
           "short_name" : "Kirribilli",
           "types" : [ "locality", "political" ]
        },
        {
           "long_name" : "New South Wales",
           "short_name" : "NSW",
           "types" : [ "administrative_area_level_1", "political" ]
        },
        {
           "long_name" : "Australia",
           "short_name" : "AU",
           "types" : [ "country", "political" ]
        },
        {
           "long_name" : "2061",
           "short_name" : "2061",
           "types" : [ "postal_code" ]
        }
     ],
     "formatted_address" : "24 Carabella St, Kirribilli NSW 2061, Australia",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : -33.84886950,
              "lng" : 151.21871730
           },
           "southwest" : {
              "lat" : -33.84960880,
              "lng" : 151.21810640
           }
        },
        "location" : {
           "lat" : -33.84892950,
           "lng" : 151.21817770
        },
        "location_type" : "RANGE_INTERPOLATED",
        "viewport" : {
           "northeast" : {
              "lat" : -33.84789016970850,
              "lng" : 151.2197608302915
           },
           "southwest" : {
              "lat" : -33.85058813029150,
              "lng" : 151.2170628697085
           }
        }
     },
     "types" : [ "street_address" ]
  },
  {
     "address_components" : [
        {
           "long_name" : "Kirribilli",
           "short_name" : "Kirribilli",
           "types" : [ "locality", "political" ]
        },
        {
           "long_name" : "New South Wales",
           "short_name" : "NSW",
           "types" : [ "administrative_area_level_1", "political" ]
        },
        {
           "long_name" : "Australia",
           "short_name" : "AU",
           "types" : [ "country", "political" ]
        },
        {
           "long_name" : "2061",
           "short_name" : "2061",
           "types" : [ "postal_code" ]
        }
     ],
     "formatted_address" : "Kirribilli NSW 2061, Australia",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : -33.84245090,
              "lng" : 151.22032150
           },
           "southwest" : {
              "lat" : -33.85270230,
              "lng" : 151.21152060
           }
        },
        "location" : {
           "lat" : -33.84753980000001,
           "lng" : 151.21314540
        },
        "location_type" : "APPROXIMATE",
        "viewport" : {
           "northeast" : {
              "lat" : -33.84245090,
              "lng" : 151.22032150
           },
           "southwest" : {
              "lat" : -33.85270230,
              "lng" : 151.21152060
           }
        }
     },
     "types" : [ "locality", "political" ]
  },
  {
     "address_components" : [
        {
           "long_name" : "2061",
           "short_name" : "2061",
           "types" : [ "postal_code" ]
        },
        {
           "long_name" : "New South Wales",
           "short_name" : "NSW",
           "types" : [ "administrative_area_level_1", "political" ]
        },
        {
           "long_name" : "Australia",
           "short_name" : "AU",
           "types" : [ "country", "political" ]
        }
     ],
     "formatted_address" : "New South Wales 2061, Australia",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : -33.84234370,
              "lng" : 151.22032150
           },
           "southwest" : {
              "lat" : -33.85270230,
              "lng" : 151.20932150
           }
        },
        "location" : {
           "lat" : -33.84839570,
           "lng" : 151.21461550
        },
        "location_type" : "APPROXIMATE",
        "viewport" : {
           "northeast" : {
              "lat" : -33.84234370,
              "lng" : 151.22032150
           },
           "southwest" : {
              "lat" : -33.85270230,
              "lng" : 151.20932150
           }
        }
     },
     "types" : [ "postal_code" ]
  },
  {
     "address_components" : [
        {
           "long_name" : "New South Wales",
           "short_name" : "NSW",
           "types" : [ "administrative_area_level_1", "political" ]
        },
        {
           "long_name" : "Australia",
           "short_name" : "AU",
           "types" : [ "country", "political" ]
        }
     ],
     "formatted_address" : "New South Wales, Australia",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : -28.15619210,
              "lng" : 153.63873290
           },
           "southwest" : {
              "lat" : -37.50503180,
              "lng" : 140.99921220
           }
        },
        "location" : {
           "lat" : -31.25321830,
           "lng" : 146.9210990
        },
        "location_type" : "APPROXIMATE",
        "viewport" : {
           "northeast" : {
              "lat" : -28.15619210,
              "lng" : 153.63873290
           },
           "southwest" : {
              "lat" : -37.50503180,
              "lng" : 140.99921220
           }
        }
     },
     "types" : [ "administrative_area_level_1", "political" ]
  },
  {
     "address_components" : [
        {
           "long_name" : "Australia",
           "short_name" : "AU",
           "types" : [ "country", "political" ]
        }
     ],
     "formatted_address" : "Australia",
     "geometry" : {
        "bounds" : {
           "northeast" : {
              "lat" : -9.22108360,
              "lng" : 159.10545890
           },
           "southwest" : {
              "lat" : -54.77721850,
              "lng" : 112.92145430
           }
        },
        "location" : {
           "lat" : -25.2743980,
           "lng" : 133.7751360
        },
        "location_type" : "APPROXIMATE",
        "viewport" : {
           "northeast" : {
              "lat" : -9.22108360,
              "lng" : 159.10545890
           },
           "southwest" : {
              "lat" : -54.77721850,
              "lng" : 112.92145430
           }
        }
     },
     "types" : [ "country", "political" ]
  }
  ],
  "status" : "OK" 
 }

I am trying to access the address component... but am unsure how to traverse the object correctly.. could someone help me.

           "long_name" : "Kirribilli",
           "short_name" : "Kirribilli",

yes this is my home address... please do not stalk me

Christopher
– Christopher

2012-02-01 23:29:53 +00:00
Commented Feb 1, 2012 at 23:29 — Christopher
– Christopher, Commented Feb 1, 2012 at 23:29

Andreas Helgegren · Accepted Answer · 2012-02-01 23:32:23Z

3

This should do it:

var long_name = object.address_components[2].long_name;
var short_name = object.address_components[2].short_name;

EDIT: suggest you use jquery ajax instead for the fetch:

var site = "./maps/scripts/reverseGeocode/locale.php";
var params = "lat="+lat+"&"+"lng="+lng;

$.get(site + '/' + params, function(data) {
    var long_name = data.address_components[2].long_name;
    var short_name = data.address_components[2].short_name;
});

edited Feb 1, 2012 at 23:32

answered Feb 1, 2012 at 23:23

Andreas Helgegren

1,67812 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Christopher Over a year ago

Thanks for your prompt response... it return object.address_components is undefined. This is the problem I had... its kinda curious any thoughts?

Christopher Over a year ago

thanks helk but am trying to avoid jQuery for this type of thing.

Andreas Helgegren Over a year ago

then you have to decode json the old fashion way =) here is a tutorial json.org/js.html

Andreas Helgegren Over a year ago

here is a good tutorial for ajax calls without jQuery: w3schools.com/ajax/ajax_aspphp.asp

Collectives™ on Stack Overflow

reading in jSON data with javascript

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related