Question

I have an HTML form in my website with a field the GPS coordinates. How can I get the coordinates so that I can plot them on Google Maps, and persist them to a database?

Answer 1

I suggest you look into the Geocoder section of the Google Maps V3 API. I just went through this issue myself. When building your form, include hidden inputs for lat and long (whatever your field names in your db) like this:

<input type="hidden" name="data[Location][lat]"  id="LocationLat"/>
<input type="hidden" name="data[Location][lon]"  id="LocationLon"/>

In your address input, you will say something like this:

<input name="data[Location][address]" onChange="getLatLong(address)" size="50" maxlength="255" type="text"/>

where you include the call to a javascript function called getLatLong().
Here is an example below of the function:

<script type="text/javascript" >

 var geocoder;
 var add = document.getElementById("LocationAddress");

 function getLatLong(address){
 geocoder = new google.maps.Geocoder();


  geocoder.geocode({ 'address':address},function(results, status){

          if (status == google.maps.GeocoderStatus.OK) {
            document.getElementById("LocationLat").value=results[0].geometry.location.lat();
              document.getElementById("LocationLon").value=results[0].geometry.location.lng();


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

}
   });

 }
 </script>

You may need to play around with it a bit. be sure to do a search for the google Geocoder here on SO, as I found my solution with bits and pieces I got straight from this site.