2009-10-12 10 views
3

J'ai un formulaire pour obtenir une adresse d'un utilisateur et envoyer cette adresse à mon serveur. L'objectif est d'utiliser le géocodage de Google pour s'assurer que l'adresse est unique et géocodable avant d'ennuyer le serveur avec.jquery submit * after * validation ajax par un tiers

Je peux lier avec succès form.submit, geocode, obtenir mes repères, m'assurer qu'ils sont uniques ou pas .. mais je suis totalement incapable de faire un travail de soumission dans mon callback. Ce qui me fait penser que je ne devrais pas le faire dans mon rappel, mais c'est pourquoi je suis ici. Fondamentalement, j'ai besoin d'un moyen d'avoir soumettre sur un appel de formulaire ma validation, qui déclenche un rappel - si/quand ce rappel est réussi, le rappel doit être en mesure de soumettre le formulaire (pas un poste AJAX, merci) sans déclencher à nouveau la validation.

Pseudocode suit, tapé à partir de la mémoire .. J'ai essayé à la fois .unbind ('submit'). Submit() et l'appel direct DOM, ni travaillé, mais je les inclus tous les deux ici pour l'enfer il.

<html> 
    <head> 
    <!-- .. load google maps and jquery .. --> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
     // ... insure Google, get geocoder, etc. 
     geocoder = ...; 

     function geocodeCallback(result) { 
      // .. check if result was a success, and unique 
      if (.. yes, success ..) { 
      // use my not-included snazzy function to normalize the address 
      $('#loc').val(normalize(result.Placemark[0])); 
      $('#myform').unbind('submit'); 
      $('#myform')[0].submit(); // see note above 
      } else { 
      // do something magically useful 
      } 
     } 

     $('#myform').bind('submit', function() { 
      geocoder.getLocations($('#loc').val(), geocodeCallBack); 
      return false; 
     }); 
     }); 
    </script> 
    </head> 
    <body> 
    <form id="myform" method="post" action="thispage.html"> 
     <input type="text" name="loc" /> 
     <input type="submit" name="sub" value="Submit" /> 
    </form> 
    </body> 
</html> 

Répondre

2

Fondamentalement, vous devez définir une valeur de sentinelle pour indiquer qu'elle est valide. Par exemple:

<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
<script type="text/javascript"> 
num = 1; 

$(function() { 
    $("#form").submit(function() { 
    if ($("#valid").val() == "false") { 
     setTimeout(callback, 1000); 
     $("#comment").text("comment " + num); 
     num++; 
     return false; 
    } 
    }); 
}); 

function callback() { 
    $("#valid").val("true"); 
    $("#form").submit(); 
} 
</script> 
</head> 
<body> 
<form id="form"> 
<div id="comment"></div> 
<input type="hidden" id="valid" name="valid" value="false"> 
<input type="text" name="loc"> 
<input type="submit" value="Submit"> 
</form> 
</body> 
</html> 

Il est également intéressant de souligner que vous ne devriez pas compter sur cette validation et vous devez répéter sur le serveur parce qu'il n'y a aucun moyen d'arrêter un attaquant potentiellement malveillant d'usurper une soumission de formulaire apparemment valide .

0

Vous pouvez retarder la décision jusqu'à ce que la forme de soumettre des données est validée:

<script type="text/javascript"> 
     $(document).ready(function() { 
     // ... insure Google, get geocoder, etc. 
     geocoder = ...; 

     var processingGeo = false; 
     var geoResult = false; 

     function geocodeCallback(result) { 
      // .. check if result was a success, and unique 
      if (.. yes, success ..) { 
      // use my not-included snazzy function to normalize the address 
      $('#loc').val(normalize(result.Placemark[0])); 
      geoResult = true; 
      } else { 
      // do something magically useful 
      geoResult = false; 
      } 
      processingGeo = false; 
     } 

     $('#myform').bind('submit', function() { 
      processingGeo = true; 
      geoResult = false; 
      geocoder.getLocations($('#loc').val(), geocodeCallBack); 
      while (processingGeo) {} 
      return geoResult; 
     }); 
     }); 
</script> 
+0

Max, ne serait pas votre réponse d'attente active le seul vrai javascript fil? Que faire si j'ai d'autres événements qui tirent? Oui, cela suppose que l'appel de géocodage prend beaucoup de temps. Quoi qu'il en soit, j'aime cette réponse, mais je voulais être clair sur ce que serait l'effet de l'utiliser. – Maas

+0

En fait, j'ai parlé trop tôt. J'aime cette réponse parce qu'elle donne un moyen clair de gérer les réponses alternatives du rappel. Cependant, tel qu'il est écrit, il tue le traitement javascript sur Safari, comme prévu. – Maas