J'ai un formulaire qui recueille une adresse de personnes. Quand ils cliquent sur submit, je veux géocoder leur adresse, et l'utiliser pour remplir les champs lat et lng. Voici ce que je fais maintenant qui est basé sur la 2ème réponse ici submit form does not stop in jquery ajax calljquery, soumettre le formulaire après google maps geocoding
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
$(document).ready(function() {
var geocoder;
var address;
$('#theform').submit(function() {
geocoder = new google.maps.Geocoder();
address = $('#id_street').val() + " " + $('#id_street2').val() + " " + $('#id_city').val() + ", " + $('#id_state').val() + " " + $('#id_zip').val();
geocoder.geocode({ 'address': address}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
$('#id_lat').val(results[0].geometry.location.lat().toFixed(6));
$('#id_lng').val(results[0].geometry.location.lng().toFixed(6));
$('#theform').unbind('submit');
$('#theform').submit();
} else {
$('#theform').unbind('submit');
$('#theform').submit();
}
});
return false;
});
});
</script>
et la forme
<form method="POST" id="theform" action="">
<li><label for="id_street">Street</label> <input id="id_street" type="text" name="street" value="3520 Lebon Dr." maxlength="100" /></li>
<li><label for="id_street2">Street2 (optional)</label> <input id="id_street2" type="text" name="street2" maxlength="100" /></li>
<li><label for="id_city">City</label> <input id="id_city" type="text" name="city" value="San Diego" maxlength="50" /></li>
<li><label for="id_state">State</label> <select name="state" id="id_state">
...a bunch of state options...
<li><label for="id_zip">Zip Code</label> <input id="id_zip" type="text" name="zip" value="92122" maxlength="30" /></li>
<label for="id_lat">Latitude</label><input type="text" name="lat" value="0.000000" id="id_lat" />
<label for="id_lng">Longitude</label><input type="text" name="lng" value="0.000000" id="id_lng" />
</form>
Les lat et les champs lng se remplissent bien, mais la forme ne soit pas réellement soumis par $ ('# theform'). submit(). Pour soumettre le formulaire, vous devez cliquer à nouveau sur Envoyer.
Des idées sur ce que je fais mal? Et au cas où quelqu'un me demanderait de soumettre le formulaire même si le géocodage échoue car dans ce cas j'utiliserai geopy pour géocoder le serveur d'adresses.
modifier: Ok donc je fait un exemple très simple et ne peut pas se soumettre à travailler tout:
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('#subby').click(function() {
$('#theform').submit();
});
});
</script>
</head>
<body>
<a href="#" id="subby">Submit</a>
<form id="#theform" action="javascript:alert('success!');">
<input type="submit" />
</form>
</body>
</html>
j'attendre à ce que lorsque vous cliquez sur le lien Soumettre obtiendriez un Alertbox comme quand vous cliquez sur le bouton Soumettre, mais ce n'est pas le cas. Qu'est-ce que je fais de mal avec submit?
L'avez-vous lancé dans un débogueur? Il est possible que la première fois que vous exécutez la méthode, la valeur 'return false;' soit atteinte, ce qui arrêtera la soumission. –
Je mets un point d'arrêt sur le retour false et $ ('# theform'). Unbind ('submit'); dans le si. Il a frappé le retour faux d'abord mais ensuite (probablement quand l'appel d'asynch à google est revenu) a frappé l'autre point d'arrêt aussi bien après quoi il devrait aller à $ ('# theform'). Submit(). Le formulaire n'était toujours pas soumis. – joshcartme
Donc, il a frappé un '$ ('# theform'). Submit()'? Est-il possible de modifier votre code pour que 'return false' soit dans un' if' ou 'else'. Bien que cela remonte au point de rupture précédent, je devine que frapper ce 'return false 'confond le programme –