I made a php page that contain a Google map. My goal is to add a marker when the user click the map, and the coordinate of the marker displayed on text box. here is my javascript:
<script type="text/javascript">
function tampil_peta()
{
var div_peta = document.getElementById('kanvas');
var tengah = new google.maps.LatLng(-8.801502,115.174794);
var options =
{
center : tengah,
zoom : 14,
mapTypeId : google.maps.MapTypeId.ROADMAP
}
//membuat objek peta Google Maps
var google_map = new google.maps.Map(div_peta,options);
google.maps.event.addListener(google_map, "click", function (e)
{
var latitude = e.latLng.lat();
var longitude = e.latLng.lng();
var location = new google.maps.LatLng(latitude,longitude);
document.getElementById('lattext').value = latitude;
document.getElementById('lngtext').value = longitude;
});
}
function add_marker(location)
{
var marker = new google.maps.Marker({
position : location,
title : "Titik A",
draggable : false,
map : google_map
});
}
</script>
and this is the code of the form which contain 2 text box that should be filled with the latitude and longitude data of the marker automatically:
<form id="koordinat_a" nama="koordinat_a" method="POST" action="">
Latitude : <input type="text" class="form-control" id="lattext" name="lattext" placeholder=" Latitude" style="width:310px">
Longitude : <input type="text" class="form-control" id="lngtext" name="lngtext" placeholder=" Longitude" style="width:310px">
<button type="button" id ="pilih" name="pilih" class="btn btn-primary" onClick="return select_titik(document.getElementById('lattext').value,document.getElementById('lngtext').value)">Choose</button>
</form>
the latitude and longitude of the clicked coordinate displayed in the textbox perfectly. my problem is just adding the marker whenever the map clicked.. Is there anyone can help me? your help will be so helpful. thank you...