Question

i have this logic: user gives his adres in the form, i will take this addres and in the submit function i will get the lat and long of this adres and save this into hidden input fields in the form and then submit the form with those lat and long inside.

my js function:

var geocoder = new google.maps.Geocoder();
function geocodeme(adr) {
    var address = adr;

    geocoder.geocode(
        {'address': address}, 
        function(results, status) {
            if (status == google.maps.GeocoderStatus.OK) {
                var latitude = results[0].geometry.location.lat();
                var longitude = results[0].geometry.location.lng();
                //alert(latitude + ' - ' + longitude);
                $('#lat').val(latitude);
                $('#long').val(longitude);
            } 
        }
    ); 
}

function submitme(){
    var adres = str + '+' + hnr + '+' + plz + '+' + stadt + '+' + land;
    var codemeadr = str + ' ' + hnr + ' ' + plz + ' ' + stadt + ' ' + land;         
    geocodeme(codemeadr);

    //document.addform.submit();
    alert($('#lat').val() + ' -- ' + $('#long').val());
}

my form:

....
<input type="hidden" name="lat" id="lat" />
<input type="hidden" name="long" id="long" />
<a href="javascript:submitme();"> Submit </a>

what the problem is that the first time when i click submit, the lat and long are empty(they are not set), but second time i hit the submit, they are set, why is this? why cannot it set the lat and long on the first submit call?

BTW: all those parameters str, hnr.. they really exist and they are not empty, but this even doesnot matter here..

thanks for help

Answer 1

That’s because geocoder.geocode is asynchronous. You must handle the result in the callback you give it.

This line must be in the callback :

alert($('#lat').val() + ' -- ' + $('#long').val());

and of course any line you put just at this point can’t use the right value.