Current coordinates returns undefined

Question

I'm trying to use getLocation function to get the current location coordinates and use those for distance calculation in future. After I run the following code, I got undefined.

<script type="text/javascript">
var currentLatitude;
var currentLongitude;

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(getCoordinates);
    } else { 
        document.getElementById("asdfsdafsdaf").innerHTML = "Geolocation is not supported by this browser.";
    }
}

function getCoordinates(position) {
    currentLatitude = position.coords.latitude;
    currentLongitude = position.coords.longitude;   
}

var xhr = new XMLHttpRequest();
xhr.open("POST", "rsvpButton.php", true);
var formData = new FormData();
    formData.append("userID", 100100);
xhr.send(formData);

xhr.onload=function(){
    getLocation();
    alert("1"+currentLongitude+" and "+currentLatitude);
    //some other codes to display the page
    //...
}
</script>

I thought I put those 2 vars in wrong places but after tried several times it still not work. Any help please? Thanks in advance.

Updates: I tried to put the bottom codes into the callback function, but the whole page disappeared.

What does “it still not work” mean? You got a Javascript error from the browser? Show us the error message. — Dour High Arch, Oct 23 '14 at 19:29
not a duplicate. `getCurrentPosition` definitely does something weird with permissions on some platforms that's not at all related to using async functions incorrectly. — worc, Apr 08 '19 at 22:09

matys84pl · Accepted Answer · 2014-10-23T19:22:53.250

1

getCurrentPosition accepts a callback, as it's asynchronous. Read more here: https://developer.mozilla.org/en-US/docs/Web/API/Geolocation.getCurrentPosition

Try putting the alert in the callback instead:

<script type="text/javascript">
var currentLatitude;
var currentLongitude;

function getLocation(callback) {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(callback);
    } else { 
        document.getElementById("asdfsdafsdaf").innerHTML = "Geolocation is not supported by this browser.";
    }
}

var xhr = new XMLHttpRequest();
xhr.open("POST", "rsvpButton.php", true);
var formData = new FormData();
    formData.append("userID", 100100);
xhr.send(formData);

xhr.onload=function(){
    getLocation(function (position) {
        var currentLatitude = position.coords.latitude;
        var currentLongitude = position.coords.longitude;   

        alert("1"+currentLongitude+" and "+currentLatitude);
        //some other codes to display the page
        //...
    });

}
</script>

edited Oct 23 '14 at 19:22

answered Oct 23 '14 at 18:41

matys84pl

8,344
1
18
18

Based on your code, what if I want to use those 2 vars somewhere else outside getCoordinates(postition) fuction? If needed, I can update my question to provide the whole codes that I have so far. – Duke Wang Oct 23 '14 at 18:53
They will still be available in the global scope, however only after getCoordinates callback is called. You can use some libraries that help to manage asynchronous code, like https://github.com/caolan/async – matys84pl Oct 23 '14 at 19:00
I have edited my question and updated it. I do need use coordinates in the xhr.onload=function(). Please advise. – Duke Wang Oct 23 '14 at 19:09

score -1 · Answer 2 · answered Oct 23 '14 at 18:42

-1

Try this:

var currentLatitude;
var currentLongitude;

function getLocation() {
    if (navigator.geolocation) {
        navigator.geolocation.getCurrentPosition(getCoordinates);
    } else { 
        alert("4");
    }
}

function getCoordinates(position) {
    currentLatitude = position.coords.latitude;
    currentLongitude = position.coords.longitude; 

    // now latitude and longitude are available
    alert(currentLongitude+" and "+currentLatitude);
}

// actually call the function getLocation
getLocation();

Here is the DEMO

answered Oct 23 '14 at 18:42

friedi

4,350
1
13
19

Based on your code, what if I want to use those 2 vars somewhere else outside getCoordinates(postition) fuction? If needed, I can update my question to provide the whole codes that I have so far. – Duke Wang Oct 23 '14 at 18:58
You have to wait as long as the variables are available. You can use a promise library to write something like this: `getLocation().then(function(coords) { // do something with coords });` Have a look at the https://github.com/kriskowal/q – friedi Oct 23 '14 at 19:14

Current coordinates returns undefined

2 Answers2