title: Jquery .Ajax - How to Pass Data
body: <p>I'm trying to pass a variable via jquery ajax call.   I'm not exactly sure how to do it properly.  I get the lon lat coordinates through another html5 script.  </p>
  
  <p>How do i get the coordinates on the other side?  I tried $_GET(lat).  </p>
  
  <p>I'm also not sure if i'm able to use the location.coords.latitude in a different &lt; script >.</p>
  
  <pre><code>$.ajax({  
      cache: false,
      url: "mobile/nearby.php", 
      dataType: "html",
      data: "lat="+location.coords.latitude+"&amp;lon="+loc.coords.longitude+,
      success: function (data2) {
      $("#nearbysgeo").html(data2);
  
      }
  });
  </code></pre>
  
  <p>These scripts are above the jquery code</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    google.setOnLoadCallback(function() {
  
      $(function() {
  
        navigator.geolocation.getCurrentPosition(displayCoordinates);
  
        function displayCoordinates(location) {
  
          var map = new GMap2(document.getElementById("location"));
          map.setCenter(new GLatLng(location.coords.latitude, location.coords.longitude), 12);
          map.setUIToDefault();
          var point = new GLatLng(location.coords.latitude, location.coords.longitude);
          var marker = new GMarker(point);
          map.addOverlay(marker);
  
  
        }
  
      })
    });
  &lt;/script&gt;   
      &lt;script type="text/javascript" charset="utf-8"&gt;
  
      function getLocation(){
  
          if (navigator.geolocation) {
  
            navigator.geolocation.getCurrentPosition(success, error);
  
          } else {
  
              document.getElementById("output").innerHTML = "Your browser doesn't handle the  GeoLocation API. Use Safari, Firefox 4 or Chrome";
  
          }
  
  
      }
      function success(loc){
  
          console.log(loc);
  
          strout = "";
  
          for(l in loc.coords){
  
              //strout += l +" = " +loc.coords[l] + "&lt;br&gt;";
  
          }
          strout += '';
          strout += '&lt;center&gt;&lt;img src="http://maps.google.com/maps/api/staticmap?center='+loc.coords.latitude+','+loc.coords.longitude+'&amp;markers=color:blue%7Clabel:Y%7C'+loc.coords.latitude+','+ loc.coords.longitude+'&amp;zoom=15&amp;size=400x250&amp;sensor=false&amp;center=currentPosition"&gt;&lt;/center&gt;';
  
          document.getElementById("output").innerHTML = strout;
  
          document.forms['newPostForm'].lat.value = loc.coords.latitude;
          document.forms['newPostForm'].lon.value = loc.coords.longitude;
          document.getElementById("coords").innerHTML = '';
          document.getElementById("coords").innerHTML = 'CURRENT: Lat:' + loc.coords.latitude + ' Lon:' + loc.coords.longitude;
  
      }
  
  
      function error(err){
  
          document.getElementById("output").innerHTML = err.message;
  
      }
  
      function clearBlog() {
              document.getElementById("listview").innerHTML = '';
          }
      &lt;/script&gt;
  </code></pre>
  
  <p>ADDITIONAL INFO:</p>
  
  <p>It works if I use this line.  So i guess i can't use loc.coords.latitude this way.</p>
  
  <pre><code>data: "&amp;lat=43&amp;lon=-79.3",
  </code></pre>
  
  <p>Well i hacked it for now to get it working.  I filled two hidden form elements on the page with lon and lat values. Then used 'document.forms['newPostForm'].lat.value' to create a line like this.  </p>
  
  <pre><code>data: "&amp;lat="+document.forms['newPostForm'].lat.value+"&amp;lon="+document.forms['newPostForm'].lon.value,
  </code></pre>
  
  <p>Still would like an actual solution.</p>