jQuery function failed to pass Geocode information to variable

Question

<script>
var geocoder;
var loc1;
var loc;


$(document).ready(function() { 
    $("#testForm").submit(function(e) {
        e.preventDefault();
        loc1 = searchAddress($('#Q1').val());
        $.post('demofindcar_p.php',{lat:loc1.lat(),lng:loc1.lng()},function(result){
            $('#output').empty().append(result);
            });
    });
});


// - Functions here - //
function searchAddress(adr) {
    geocoder = new google.maps.Geocoder();  
    geocoder.geocode({address:adr}, function(result){
        loc = result[0].geometry.location;
    });
    return loc;
}


</script>

I have the above code. It consists of a searchAddress function which takes in address that user input from a form and return latitude and longitude information via the "loc" variable.

the AJAX part takes in lat lng information and calculate straight line distances with the addrsses in my database. This part works fine.

However, looking at the following code:

loc1 = searchAddress($('#Q1').val());

I can't pass loc to loc1. I got an error message under $.post{}:

Uncaught TypeError: Cannot Call Method 'lat' of undefined.

what is the problem with this code??? :(

score 0 · Answer 1 · answered Jan 19 '12 at 17:17

The geocoder doesn't work quite like how you've implemented it. The function(result) callback won't expose loc for your return. I'd try something like this:

$(document).ready(function() { 
  $("#testForm").submit(function(e) {
    e.preventDefault();
    loc1 = searchAddress($('#Q1').val());
  });
});

function searchAddress(adr) {
  geocoder = new google.maps.Geocoder();  
  geocoder.geocode({address:adr}, function(result){
    loc = result[0].geometry.location;
    $.post('demofindcar_p.php', {lat:loc.lat(),lng:loc.lng()}, function(result){
      $('#output').empty().append(result);
    });
  });
}

jQuery function failed to pass Geocode information to variable

1 Answers1