Javascript local and global variables losing scope in callback function

Question

I have tried different variable scopes and none seem to work? My callback is getting a valid result but no matter the scope of the variable I assign it to I lose the value once the callback ends??

var geocoder;
var Lat;
var Long;

function codeAddress()
{


    var geocoder = new google.maps.Geocoder();

    var addy1......

    geocoder.geocode({ 'address': fullAddress }, function (results, status) {
        if (status == google.maps.GeocoderStatus.OK)
        {
            Lat = results[0].geometry.location.lat();
            Long = results[0].geometry.location.lng();

        }
        else
        {
            alert("Geocode was not successful for the following reason: " + status);
        }


    });
    alert(Lat);
    document.getElementById("Address_AddyLat").type.value = Lat;
    document.getElementById("Address_AddyLong").value = Long;
}

Thank for your input.

Looks like a dup of stackoverflow.com/questions/14220321/… — elclanrs
– elclanrs, Commented Sep 17, 2013 at 4:05
They're not losing scope, they simple were not assigned a value when you accessed them. geocode is an asynchronous function, and you will need to put everything that works with its result in the callback — Bergi
– Bergi, Commented Sep 17, 2013 at 4:08
Well I tried that originally....and switched to this. I can try again. if (status == google.maps.GeocoderStatus.OK) { document.getElementById("Address_AddyLat").value = results[0].geometry.location.lat(); document.getElementById("Address_AddyLong").value = results[0].geometry.location.lng(); } doesn't update the form??? — GPGVM
– GPGVM, Commented Sep 17, 2013 at 4:11

Ameen · Accepted Answer · 2013-09-17 04:11:28Z

1

geocode is an asynchronous function, so when you call it, it immediately returns and the next lines are executed before the value of Lat is set. Think of it this way:

geocoder.geocode({ 'address': fullAddress }, /*...*/); // 1
alert(Lat); // 2
document.getElementById("Address_AddyLat").type.value = Lat; // 3
document.getElementById("Address_AddyLong").value = Long; // 4

What you want to do is to actually read the value of Lat in the callback itself:

geocoder.geocode({ 'address': fullAddress }, function (results, status) {
    if (status == google.maps.GeocoderStatus.OK)
    {
        Lat = results[0].geometry.location.lat();
        Long = results[0].geometry.location.lng();

        alert(Lat);
        document.getElementById("Address_AddyLat").type.value = Lat;
        document.getElementById("Address_AddyLong").value = Long;
    }
    else
    {
        alert("Geocode was not successful for the following reason: " + status);
    }


});

answered Sep 17, 2013 at 4:11

Ameen

2,5861 gold badge15 silver badges17 bronze badges

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

2 Comments

GPGVM Over a year ago

Whoever down voted could rub my nose with a correct answer. Ameen it does NOT work. alert(Lat) has proper value but the document elements do not update??

Ameen Over a year ago

Well, what's the type of Address_AddyLat? Is it an input with type text? If so, you want to do document.getElementById("Address_AddyLat").value = Lat (without the type)

james emanon · Accepted Answer · 2013-09-17 04:56:08Z

0

I think Ameen has the right of it. Your element reference must be incorrect.

Try this:

document.getElementById("Address_AddyLat").value = Lat;

or

document.getElementById("Address_AddyLat").setAttribute("value",Lat);

answered Sep 17, 2013 at 4:56

james emanon

11.9k12 gold badges70 silver badges107 bronze badges

Comments

Sohil Desai · Accepted Answer · 2013-09-17 06:25:25Z

As Ameen said geocode is a asynch process so you need to put your alert & display code in callback function. and your another mistake is that you are using lat() & lng() as a method, its not a method its a property you just need to use it directly. so your code some look like.

geocoder.geocode({ 'address': fullAddress }, function (results, status) {
    if (status == google.maps.GeocoderStatus.OK)
    {
        Lat = results[0].geometry.location.lat;
        Long = results[0].geometry.location.lng;

        alert(Lat);
        document.getElementById("Address_AddyLat").value = Lat;
        document.getElementById("Address_AddyLong").value = Long;
    }
    else
    {
        alert("Geocode was not successful for the following reason: " + status);
    }
});

Collectives™ on Stack Overflow

Javascript local and global variables losing scope in callback function

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related