Search code examples
javascriptjqueryasp.net-mvcgoogle-mapsgoogle-maps-api-2

How do I use Google Maps geocoder.getLatLng() and store its result in a database?


Hey everybody! Im trying to use getLatLng() to geocode a list of postal/zip codes and store the generated point in the database to be placed on a map later. This is what I've got so far:

 $(".geocodethis").click(function () {
    var geocoder = new GClientGeocoder();
    var postalCode = $(this).siblings(".postal").val();
    var id = $(this).siblings(".id").val();

    geocoder.getLatLng(postalCode, function (point) {
        if (!point) {
            alert(postalCode + " not found");
        } else {
            alert(point);
            var serializedPoint = $.param(point);                
            //Geocode(id, point);
        }
    });

});

function Geocode(id, point) {
    alert(point);
    $.post("/Demographic/Geocode/" + id, point, function () {
        alert("success?");
    });
}

but I'm getting this.lat is not a function in my error console when i try to serialize the point object or use it in $.post()

From my research, I understand that geocoder.getLatLng() is asynchronous, how would that affect what I'm trying to do? I'm not running this code in a loop, and I'm trying to post the point using the anonymous callback function.

How can I save the information from point to use later?

Update

Creating a marker and trying to post that still results in the this.lat is not a function in the error console.

$(".geocodethis").click(function () {
        var geocoder = new GClientGeocoder();
        var postalCode = $(this).siblings(".postal").val();
        var id = $(this).siblings(".id").val();

        geocoder.getLatLng(postalCode, function (point) {
            if (!point) {
                alert(postalCode + " not found");
            } else {
                alert(point);
                var marker = new GMarker(point);

                $.post("/Demographic/Geocode/" + id, marker, function () {
                    alert("success?");
                });
            }
        });

    });

** Another Update **

I really need to save the geocoded address for later, even if I store the latitude/longitude values in my database and remake the marker when I'm ready to put it onto a map. Again, serializing or posting - seemingly using the point in any way other than in google maps functions gives the this.lat is not a function exception in my error log.

I'm using asp.net mvc - are there any frameworks out there that would make this easier? I really need help with this. Thanks.


Solution

  • If your stuck for 2 days maybe a fresh v3 start would be a good thing, this snipped does a similair job for me...

              function GetLocation(address) {
              var geocoder = new google.maps.Geocoder();
              geocoder.geocode({ 'address': address }, function (results, status) {
                  if (status == google.maps.GeocoderStatus.OK) {
                      ParseLocation(results[0].geometry.location);
    
                  }
                  else
                    alert('error: ' + status);
    
              });
          }
    
      }
    
      function ParseLocation(location) {
    
          var lat = location.lat().toString().substr(0, 12);
          var lng = location.lng().toString().substr(0, 12);
    
          //use $.get to save the lat lng in the database
          $.get('MatchLatLang.ashx?action=setlatlong&lat=' + lat + '&lng=' + lng,
                function (data) {
                    // fill textboss (feedback purposes only) 
                    //with the found and saved lat lng values
                    $('#tbxlat').val(lat);
                    $('#tbxlng').val(lng);
                    $('#spnstatus').text(data);
    
    
                });
        }