title: How to get the formatted address from a dragged marker in Google Version Maps
body: <p>I have made a Google map that lets you input an address into a text field.  It then navigates you to the address that you entered into the text field and leaves a draggable marker that when dragged shows you the Lat and Long and The Geolocated Address. </p>
  
  <p>I instead of displaying the above address, would like when you drag the marker to display in the bottom corner the Address of the Marker and the not the inputted address from the text field.</p>
  
  <p>I have tried a number of methods to no avail. lonlat[0].formatted_address was amongst some of the things i tried. </p>
  
  <p>I got my reference from <a href="https://gmaps-samples-v3.googlecode.com/svn-history/r49/trunk/draggable-markers/draggable-markers.html" rel="noreferrer">Google</a> </p>
  
  <p>My code is below:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;meta name="viewport" content="initial-scale=1.0, user-scalable=no"/&gt;
  &lt;meta http-equiv="content-type" content="text/html; charset=UTF-8"/&gt;
  &lt;title&gt;Google Maps JavaScript API v3 Example: Geocoding Simple&lt;/title&gt;
  &lt;link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" /&gt;
  &lt;script src="http://maps.google.com/maps/api/js?v=3.5&amp;amp;sensor=false"&gt;&lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
  var geocoder;
  var map;
  function initialize() {
  geocoder = new google.maps.Geocoder();
  var latlng = new google.maps.LatLng(-34.397, 150.644);
  var myOptions = {
  zoom: 8,
  center: latlng,
  mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  
  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  }
  
  function codeAddress() {
  var address = document.getElementById("address").value;
  geocoder.geocode( { 'address': address}, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {
  map.setCenter(results[0].geometry.location);
  
  var marker = new google.maps.Marker({
      map: map,
      draggable: true,
      position: results[0].geometry.location
  
  });
     // Javascript//
     google.maps.event.addListener(marker, 'dragend', function(evt){
     document.getElementById('current').innerHTML = '&lt;p&gt;Marker dropped: Current Lat: ' + evt.latLng.lat().toFixed(3) + ' Current Lng: ' + evt.latLng.lng().toFixed(3) + '&lt;/p&gt;';
     });
  
     google.maps.event.addListener(marker, 'dragstart', function(evt){
     document.getElementById('current').innerHTML = '&lt;p&gt;Currently dragging marker...&lt;/p&gt;';
     });
  
     google.maps.event.addListener(marker, 'dragend', function(evt){
     document.getElementById('info').innerHTML = '&lt;p&gt;Address:  ' + results[0].formatted_address + '&lt;/p&gt;';
     });
  
     google.maps.event.addListener(marker, 'dragstart', function(evt){
     document.getElementById('info').innerHTML = '&lt;p&gt;Currently dragging marker...&lt;/p&gt;';
     });
  
  
  
   map.setCenter(marker.position);
   marker.setMap(map);
  
    } else {
      alert("Geocode was not successful for the following reason: " + status);
      }
       });
          }
  &lt;/script&gt;
  
  &lt;style type="text/css"&gt;
  #controls {
  position: absolute;
  bottom: 1em;
  left: 100px;
  width: 400px;
  z-index: 20000;
  padding: 0 0.5em 0.5em 0.5em;
  }
  html, body, #map_canvas {
          margin: 0;
          width: 100%;
          height: 100%;
  }
  &lt;/style&gt;
  &lt;/head&gt;
  &lt;body onLoad="initialize()"&gt;
  &lt;div id="controls"&gt;
  &lt;input id="address" type="textbox" value="Sydney, NSW"&gt;
  
  &lt;input type="button" value="Geocode" onClick="codeAddress()"&gt;
  &lt;div id="current" style="background-color:white;"&gt;Nothing yet...&lt;/div&gt;
  &lt;div id="info" style="background-color:white;"&gt;Address:&lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  
  
  &lt;div id="map_canvas"&gt;&lt;/div&gt;
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>