Question

I’m writing a web application in Python. I’ve got a form that takes as input two user-specified entries, one is a text field and the other is a selection. Upon submission, I GET these entries and store them to the database, which later gets queried and posted up. Anyway, it takes JavaScript to grab the User’s coordinates, which I need, and I’ve got the JavaScript embedded in my template and it’s SUPPOSED to be inputting the coordinates to “hidden” input fields. I can’t seem to call and successfully retrieve those element’s contents with the standard call (using GAE and Python)

latitude = self.request.get("latitude")
longitude = self.request.get("longitude")

Here is the embedded JavaScript and form input elements:

   <script>
   function get_location()      {
                            if (navigator.geolocation)      {
                            navigator.geolocation.getCurrentPositon(showPosition);
                            } else {
                                    alert('It appears geolocation isnt enabled.');
                            }
                    }
                    function showPosition(position)
                            {
                            $("#latitude").val(position.coords.latitude);
                            $("#longitude").val(position.coords.longitude);
                    }
    </script>

    <input type="hidden" name="latitude" id="latitude" />
    <input type="hidden" name="longitude" id="longitude" />
    <br>
    <input type="submit" onclick="get_location()" value="Update">

FYI, this is all within the same form. So, theoretically, this should be generating the latitude and longitude of the user and then passing those values to their respective input fields. Is there any obvious reason this isn’t working? Thanks in advance.

Answer 1

getCurrentPosition() is asynchronous. It probably will not have completed before your form is submitted, thus the field values are not filled in.

One way to solve that problem is to not submit your form until getCurrentPosition() has finished and has called showPosition(). To do that, you would need to block the default form submission by returning false from get_location() and returning that return value in your onclick handler and then programmatically submit the form when showPosition() is called after the hidden location fields have been set.

Another way to solve that issue is to fill in the current position when the form is initially displayed and not wait until you’re trying to submit it.

FYI, see Uncaught ReferenceError: lat is not defined for someone else having a similar problem today with the asynchronous nature of getCurrentPosition().