tags:

views:

14

answers:

1

How do I take Google map coordinates from the map and automatically populate another form element?

This is my form: http://www.barbadosphonebook.com/list-your-business-for-free/. At the bottom there is a Google map which, on-click, displays the coordinates. I would love it to also populate the element below with the coordinate data.

My map code:

<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=true"&gt;
</script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(13.175771, -59.556885);
var myOptions = {
  zoom: 10,
  center: latlng,
  navigationControl: true,
  mapTypeControl: true,
  scaleControl: true,
  mapTypeId: google.maps.MapTypeId.HYBRID
};
var map = new google.maps.Map(document.getElementById("map_canvas"),myOptions);
//
var contentString = '<strong>Copy the numbers between the brackets</strong><br />';
 google.maps.event.addListener(map, 'click', function(event) {
 new google.maps.InfoWindow ( { position: event.latLng, content: contentString+event.latLng.toString() } ).open(map);
});
}
</script>
A: 

You could try changing your map click listener to this:

google.maps.event.addListener(map, 'click', function(event) {
  new google.maps.InfoWindow ( { position: event.latLng, content: contentString+event.latLng.toString() } ).open(map);
  $('.ginput_container input').val(event.latLng.toString());
}); 
Sudhir Jonathan
That didn't seem to work. Do I need to edit the input reference? I've added my map code to the original question above.
trnsfrmr
Are you using jQuery? I can't seem to use $ as a jquery function on your page...
Sudhir Jonathan
Nope, not using jQuery.
trnsfrmr
Well, then you can replace `$('.ginput_container input').val(...)` with your framework's way of grabbing an element and modifying it's value...
Sudhir Jonathan