2011-12-11 27 views
1

我已經設法在點擊時將標記添加到Google地圖,但是現在我需要在每次放置新標記時更新表格中的<input>字段。所以,當放置一個新標記時,有問題的輸入用標記的緯度和經度更新。更新PHP <input>字段來自帶有GMaps標記位置的JavaScript

我正在使用Google Maps Javascript API v3。

這裏是我的javascript:

<script type="text/javascript"> 
function load() { 
    var map = new google.maps.Map(document.getElementById("map"), { 
     center: new google.maps.LatLng(39.47860556892209,-3.328857421875), 
     zoom: 7, 
     mapTypeId: 'roadmap' 
    }); 

    var infoWindow = new google.maps.InfoWindow; 
    google.maps.event.addListener(map, 'click', function(event) { 
     //NEITHER OF THESE 2 OPTIONS WORK 
     cambiarMarker(event.latLng); 
     //document.getElementById("lat").value = event.latLng.lat(); 
     //document.getElementById("lng").value = levent.latLng.lng(); 
     document.forms['insertData'].lati.value = location.lat(); 
     document.forms['insertData'].long.value = location.lng(); 
    }); 

    var markerActual; 

    function cambiarMarker(location) { 
     //CREATES AND PUT THE NEW MARKER 
    } 

    downloadUrl("phpsqlajax_genxml2.php", function(data) { 
     //GETS INFO FROM AN XML THAT IS CREATED FROM THE DATABASE WITH PHP 
    } 

    function bindInfoWindow(marker, map, infoWindow, html) { 
     //BINDS INFORMATION WINDOW WITH THE XML INFO 
    } 


    function downloadUrl(url, callback) { 
     //GET THE XML FILE 
    } 

    function parseXml(str) { 
     //PARSES FROM THE XML 
    } 

    function doNothing() {} 
</script> 

這是我的HTML:

<body onload="load()"> 
    Aqui debería salir algo 
    <div id="map" style="width: 500px; height: 300px"></div> 
    <form name="insertData" action="insertar_datos.php" method="post"> 
     Nombre: <input type="text" name="name"><br> 
     Dirección: <input type="text" name="address"><br> 
     Latitud: <input type="text" name="lati" id="lat"><br> <!--HERE'S INPUT1-LATITUDE--> 
     Longitud: <input type="text" name="long" id="lng"><br> <!--HERE'S INPUT2-LONG--> 
     Teléfono de contacto: <input type="text" name="telefono"><br> 
     Comentario: <textarea name="comentario"></textarea><br> 
     <input type="submit" value="Enviar"> 
    </form> 
</body> 

回答

0

原則,你也可以處理在輸入域change事件,並設置標誌的座標。這是我在我的應用程序中所做的。而且我還處理標記的drag事件,並在拖動過程中更改座標。在這種情況下,處理標記的事件dragdragenddragend你必須處理,drag不是這樣,但當拖動標記時讓座標改變很酷:)

可以處理輸入字段的改變事件,例如,這種方式(使用jquery,假設標記像<input id="coords"...):

$('input#coords').change(function() { 
    // do the job here: 
    // - convert field coordinates to latLng 
    // for reading the field value use $('input#coords').val() 
    // - set the marker position to the new one 
}); 
+0

我在JS和PHP真正的新手。你可以請我帶領我如何處理變更事件?我可能會在拖動中實現更改,但首先我想簡單的工作:P – danielrozo

+0

@ danirolo7,我更新了我的帖子以顯示如何使用jquery處理事件。 – TMS