I want to pass the address of a Google dragable map marker in a field and then submit it in a column in the MySQL database. Want to do I found the code given below which I really want but I want to keep the "closest match address" results inside the input area. How can I do that?
& lt; Html & gt; & Lt; Top & gt; & Lt; Meta name = "viewport" content = "initial-scale = 1.0, user-scalable =" /> & Lt; Script type = "text / javascript" src = "http://maps.google.com/maps/api/js?sensor=false" & gt; & Lt; / Script & gt; & Lt; Script type = "text / javascript" & gt; Var Geocoder = new google.maps.Geocoder (); Function geocodePosition (pos) {geocoder.geocode ({latLng: pos}, function (responses) {If (responses and responses length> gt; 0) {updateMarkerAddress (responses [0] .formatted_address);} and {updateMarkerAddress (' The address can not be determined at this location. ');}}); } Function Update markerstats (str) {document.getElementById ('MarkerStatus'). InnerHTML = str; } Function Update MarkerPause (latLng) {document.getElementById ('info'). InnerHTML = [latLng.lat (), latLng.lng ()] .join (','); } Function update marker address (ARR) {document.getElementById ('address'). InnerHTML = str; } Initialize function () {var latLng = new google.maps.LatLng (-34.397, 150.644); Var map = new google.maps.Map (document.getElementById ('mapCanvas'), {zoom: 8, center: latLng, mapTypeId: google.maps.MapTypeId.ROADMAP}); Var marker = new google.maps.marker ({status: latLng, title: 'point a', map: map, dragable: true}); // Update current status information updateMarkerPosition (LatLng); GeocodePosition (LatLng); // Add event viewers to Google.maps.event.addListener (marker, 'dragert', function () {updateMarkerAddress ('dragging ...');}); Google.maps.event.addListener (Marker, 'Drag', Function () {updateMarkerStatus ('Drag ...'); UpdateMarkerPosition (marker.getPosition ());}); Google.maps.event.addListener (Marker, 'drands', function () {updateMarkerStatus ('drag-edged'); Geocodeposition (marker .getPosition ());}); } // Google.maps.event.addDomListener (window, 'load', start) to close the onload handler app; & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; Style & gt; #mapCanvas {width: 500px; Height: 400px; Float: left;} #infoPanel {float: left; Margin-left: 10px;} #infoPanel div {margin-bottom: 5px;} & lt; / Style & gt; & Lt; Div id = "mapCanvas" & gt; & Lt; / Div & gt; & Lt; Div id = "infopanel" & gt; & Lt; B & gt; Marker Status: & lt; / B & gt; & Lt; Div id = "markerStatus" & gt; & Lt; I & gt; Click and drag the marker. & Lt; / I & gt; & Lt; / Div & gt; & Lt; B & gt; Current Status: & lt; / B & gt; & Lt; Div id = "info" & gt; & Lt; / Div & gt; & Lt; B & gt; Closest match address: & lt; / B & gt; & Lt; Div id = "address" & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Body & gt; & Lt; / Html & gt;
Change:
& lt; Div id = "address" & gt; & Lt; / Div & gt; Function update mark address (str) {document.getElementById ('address'). InnerHTML = str; }
to:
& lt; Input id = "address" / & gt; Function update mark address (str) {document.getElementById ('address'). Value = str; }
No comments:
Post a Comment