views:

268

answers:

1

hi,

I'm doing some geocoding using the google maps API. The user fill a form with some address, and when the submit button is clicked, a codeAddress() function is called, which is supposed to perform the geocoding, but it does not work. As a test, I hardcoded the address and call the codeAddress function when the document in an initialize(). When codeAddress is called when the page is ready, it works ok, but when it's called by the onclick script, it doesn't work (no errors returned by firebug!).

Anybody can help? Thanks

(you can paste the code in here: http://code.google.com/apis/ajax/playground/?exp=maps#map%5Fsimple, or change the google api key)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps API Sample</title>
<script src="http://maps.google.com/maps?file=api&amp;amp;v=2&amp;amp;sensor=false&amp;amp;key=ABQIAAAA1XbMiDxx_BTCY2_FkPh06RRaGTYH6UMl8mADNa0YKuWNNa8VNxQEerTAUcfkyrr6OwBovxn7TDAH5Q"&gt;&lt;/script&gt;
<script type="text/javascript">

function initialize() {
  if (GBrowserIsCompatible()) {

    var map = new GMap2(document.getElementById("map_canvas"));
    map.setCenter(new GLatLng(37.4419, -122.1419), 13);

    codeAddress(); 
  }

}

function codeAddress() {
    var geocoder = new GClientGeocoder();
    var address = "paseo montjuic, 30, barcelona, spain";
    geocoder.getLatLng( address, function(point) {

        if (point) {
            alert(point);
        } else {
            alert("Geocode was not successful");
        }
     });
 }


</script>
</head>
<body onload="initialize()" onunload="GUnload()" style="font-family: Arial;border: 0 none;">
<div id="map_canvas" style="width: 500px; height: 300px"></div>


<form action="" method="POST">
<!-- stuff -->
<input type="Submit" value="Submit" onclick="codeAddress();" />
</form>

</body>
</html>
+1  A: 

Looks to me right after codeAddress(); is called on the onclick event, your POST is done immediately. Thus it looks to you that the code failed, but in fact it is working.

What you can do is:

1) Remove the form, just a button using the onclick event. Example:

<input type="button" value="Submit" onclick="codeAddress();" />

2) Disable submitting form when event onclick hits by adding return false;. Example:

<form action="" method="POST">
<!-- stuff -->
<input type="Submit" value="Submit" onclick="codeAddress();return false;" />
</form>
thephpdeveloper
But if codeAddress() were called in onclick, I would see the alert, right?
jul
it would work as per how you call it from the script. which means you should see the alert.
thephpdeveloper
Ok, it seems that the page reloads when the form is submitted without waiting for codeAddress(). Works with "return false;". Thanks!
jul
put a tick to it so that other people know that this is the answer =)
thephpdeveloper