使用Google Maps Geocoded Lat Long提交PHP表单的问题

Question

I have a html form of mine which includes the following code.

<input type="text" style="opacity:0;" id="latlong" name="latlong" value="" />
<input type="submit" name="submit1" onClick="return validate();" value="Submit"/>

The Javascript's validate function looks like this.

<script type="text/javascript">
function validate()
{
    if($("#near_buil_id").val()==''){
        var address = "\""+$("#nearest_building").val()+","+$("#flat").val()+","+$("#near_road").val()+","+$("#landmark").val()+","+$("#street").val()+","+$("#region").val()+","+$("#city").val()+","+$("#state").val()+"\"";
        geocoder.geocode({ 'address': address }, function(results, status) {
          if (status == google.maps.GeocoderStatus.OK) {
            $("#latlong").val("POINT("+results[0].geometry.location.k+" "+results[0].geometry.location.A+")");
            //console.log($("#latlong").val());
            return true;
          }
          else{
            console.log(status);
            console.log(results);
            return false;
          }
          });
    }else{
        return false;
    }
    return true;
}
</script>

My issue is that when I submit this form, and try to take the value of $_POST['latlong'], a null value is obtained. Also, when I put return false at the end of the function and console.log the value that I am appending in $("#latlong"), I get the expected value.

Can anyone help me in resolving the issue?? Thanks in advance.

Answer 1

In your submit button html you should move your code for onclick to onsubmit. onsubmit is run before the form is submitted whereas onclick is not, so in essence you are 'submitting' the form, with a null value in the latlong input, before your javascript code puts a value in the latlong input.

Note onsubmit should be a form attribute.