Draggable Pin Not Updating Coordinates In Google Maps Api

I have this code that allows users to insert pins in Google Maps, by clicking on the map. Now I'm trying to make this pin draggable, so I just added draggable:true, in the init

Solution 1:

It's not updating the coordinates because you don't tell it to do so. You have to add a dragend-handler and update your element, where you display the coordinates when the drag of the marker is finished:

marker.addListener('dragend', function(event){
    document.getElementById("LatLng-Input").value = event.latLng.lat() + ", " + event.latLng.lng();
});

If you would have an infowindow you would have to update the content of the infowindow:

marker.addListener('dragend', function(event){
    infoWindow.setContent(event.latLng.lat() + ", " + event.latLng.lng());
});

If you want to update the coordinates also while dragging, add another handler with 'drag' instead of 'dragend'.