Hello all,
Hoping you can help, I have a google map API3 and I am trying to submit a form to a DB via a JS Script. the code is below and my question is how ca i assign the values of the Lat and Lng before the for is submitted. I cant seem to get the order right. the rest of the data goes across fine just the lat and lng that doesn't.

Please help

Code:
<!DOCTYPE html >
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=yes" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <title>My Map</title>
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js"></script>
    <script type="text/javascript">
    var marker;
    var infowindow;
     var customIcons = {
      restaurant: {
        icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png'
      },
      bar: {
        icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png'
      },
      view: {
        icon: 'http://icons/stargold.png'
      }
    };
    function initialize() {
      var latlng = new google.maps.LatLng(-16.9203249,145.7305034);
      var options = {
        zoom: 13,
        center: latlng,
        mapTypeId: google.maps.MapTypeId.HYBRID
      }
      var infoWindow = new google.maps.InfoWindow;
      
      downloadUrl1("get_data.php", function(data) {
        var xml = data.responseXML;
        var markers = xml.documentElement.getElementsByTagName("marker");
        for (var i = 0; i < markers.length; i++) {
          var name = markers[i].getAttribute("name");
          var address = markers[i].getAttribute("address");
          var type = markers[i].getAttribute("type");
          var attachment = markers[i].getAttribute("attachment");
          var point = new google.maps.LatLng(
              parseFloat(markers[i].getAttribute("lat")),
              parseFloat(markers[i].getAttribute("lng")));
          var html = "<b></b><br/><b>" + name + "</b><br/>" + address;
          var icon = customIcons[type] || {};
          var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: icon.icon
          });
          bindInfoWindow(marker, map, infoWindow, html);
        }
      });
      
      function bindInfoWindow(marker, map, infoWindow, html) {
      google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
      });
    }
      
      var map = new google.maps.Map(document.getElementById("map-canvas"), options);
      var html = "<form action='addrow.php' enctype='multipart/form-data' method='post' id='add_data'>"+
                 "<table>" +
                 "<tr><td>Name:</td> <td><input type='text' name='name' id='name'/> </td> </tr>" +
                 "<tr><td>Address:</td> <td><input type='text' name='address' id='address'/></td> </tr>" +
                 "<tr><td></td> <td><input type='hidden' name='lat' id='lat'/></td> </tr>" +
                 "<tr><td></td> <td><input type='hidden' name='lat' id='lng'/></td> </tr>" +
                 "<tr><td>Type:</td> <td><select name='type' id='type'>" +
                 "<option value='bar' SELECTED>Bar</option>" +
                 "<option value='restaurant'>Restaurant</option>" +
                 "</select> </td></tr>" +
                 "<tr><td>Attachment:</td><td><input type='file' name='attachment' id='attachment'></td></tr>" +
                 "<tr><td></td><td><input type='button' value='Save & Close' onclick='saveData()' /></td></tr>";
    infowindow = new google.maps.InfoWindow({
     content: html
    });

    google.maps.event.addListener(map, "click", function(event) {
        marker = new google.maps.Marker({
          position: event.latLng,
          map: map
        });
        google.maps.event.addListener(marker, "click", function() {
          infowindow.open(map, marker);
        });
    });
    }

    function saveData() {
      var name = escape(document.getElementById("name").value);
      var address = escape(document.getElementById("address").value);
      var type = document.getElementById("type").value;
      var attachment = document.getElementById("attachment").value;
      var latlng = marker.getPosition();
      //document.getElementById("add_data").method="post";
      //document.getElementById("add_data").submit();
      var url = "travel_addrow.php?name=" + name + "&address=" + address +
                "&type=" + type + "&lat=" + latlng.lat() + "&lng=" + latlng.lng();
      downloadUrl(url, function(data, responseCode) {
        if (responseCode == 200 && data.length >= 1) {
          infowindow.close();
          location.reload();
          document.getElementById("message").innerHTML = "Location added.";
          
        }
      });
    }

    function downloadUrl1(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request, request.status);
        }
      };
      request.open('GET', url, true);
      request.send(null);
    }
    
    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;

      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request.responseText, request.status);
        }
      };

      request.open('POST', url, true);
      request.send(null);
    }

    function doNothing() {}
    </script>
  </head>

  <body style="margin:20px; padding:20px;" onload="initialize()">
    <div id="map-canvas" style="width: 750px; height: 450px;  margin-left: auto;
    margin-right: auto;"></div>
  </body>

</html>