使用Google Maps标记坐标作为表单输入

Question

From the below javascript function, I get a javascript variable marker with coordinates when the user clicks a position on the map.

var marker;
function placeMarker(location) {
  if ( marker ) {
    marker.setPosition(location);
  } else {
    marker = new google.maps.Marker({
      position: location,
      map: map
    });
  }
}
google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(event.latLng);
});

Question How can these coordinates be used as form input?

<form method="POST" action="/authors" target="" enctype="multipart/form-data">
   ...
</form>

Answer 1

All you have to do is take the location variable and assign it to your form input like this:

First, add a hidden input field

<form method="POST" action="/authors" target="" enctype="multipart/form-data">
   <input id="location" name="location" type="hidden" value="" />
</form>

Second, make sure the location variable gets added to your input

var marker;
function placeMarker(location) {
  if ( marker ) {
    marker.setPosition(location);
  } else {
    marker = new google.maps.Marker({
      position: location,
      map: map
    });
  }

  $("#location").val(location);

}
google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(event.latLng);
});

Now, whenever placeMarker(location) gets called it will update the input with the id of "location" and its value is the output of location .