I have the following code to parse the country when the autocomplete list is selected:

$('#spot_address').autocomplete({

  // This bit uses the geocoder to fetch address values

  source: function(request, response) {

    geocoder.geocode( {'address': request.term }, function(results, status) {

      // Get address_components

      for (var i = 0; i < results[0].address_components.length; i++)

      {

        var addr = results[0].address_components[i];

        var getCountry;

        if (addr.types[0] == 'country') 

          getCountry = addr.long_name;

      }

      response($.map(results, function(item) {

        return {

          label: item.formatted_address,

          value: item.formatted_address,

          latitude: item.geometry.location.lat(),

          longitude: item.geometry.location.lng(),

          country: getCountry

        }

      }));

    })

  },



  // This bit is executed upon selection of an address

  select: function(event, ui) {

    // Get values

    $('#spot_country').val(ui.item.country);

    $('#spot_lat').val(ui.item.latitude);

    $('#spot_lng').val(ui.item.longitude);

    var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);

    marker.setPosition(location);

    map.setCenter(location);

  },



  // Changes the current marker when autocomplete dropdown list is focused

  focus: function(event, ui) {

    var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);

    marker.setPosition(location);

    map.setCenter(location);

  }

});

However, the code above doesn't work, and when the country is parsed, only the first result of the autocomplete is parsed no matter what, which is significant with the array results[0] because it only fetches the first result.

I tried to move it to the select function, but ui in select only contains formatted_address, longitude and latitude, but not the address_components.

What must I do to send the correct country when the autocomplete list item is selected?

Many thanks.