2009-08-27 3 views
1

J'ai une forme (signup.php) qui apparaît dans une fenêtre nyroModal lorsque je clique sur un bouton:utilisation ajax validation avec javascript soumettre dans la fenêtre modale nyroModal

<input value="Edit" class="nyroModal" type="button" href="signup.php"> 

Je voudrais utiliser une certaine forme de Validation AJAX (pour vérifier si le nom d'utilisateur a été pris, par exemple) avant de soumettre le formulaire.

Je me suis dit ceci: Lorsque l'utilisateur clique sur le bouton 'soumettre'. il appelle la fonction javascript avec onClick qui envoie les champs requis à un script PHP, qui retourne si les champs sont valides. Ensuite, si le champ est invalide, il avertit l'utilisateur, mais lorsque le champ est valide, il soumet le formulaire via quelque chose comme $('#formid').submit();. Assez facile en théorie.

MAIS

Le problème est, lorsque le nyroModel obtient la nouvelle forme à partir d'une URL, et crée un div dans les DOM avec le contenu en elle, Firefox ignore complètement toutes les <script> balises. En utilisant Firebug, je peux voir qu'il obtient les balises <script> avec la réponse, mais Firefox les ignore. En outre, je ne peux pas créer une fonction jQuery sur la page à partir de laquelle le modèle est appelé, car lorsque le document est créé, le formulaire n'existe pas encore dans DOM.

Des idées pour résoudre ce problème?

Répondre

1

Essayez d'ajouter un gestionnaire soumettre à la forme:

onClick='return frmSubmit()' 

Dans ce gestionnaire, vous devez d'abord sérialiser les données du formulaire et le soumettre au script de validation. Assurez-vous de return false après l'envoi de la demande, comme cela est fait de manière asynchrone. Dans le rappel de réponse, vous implémentez ce qui suit: si la réponse indique que l'entrée est valide, vous soumettez par programme le formulaire avec la méthode .submit(). Si, toutefois, la réponse indique que quelque chose ne va pas (vous devrez fournir les commentaires au format JSON), joignez des commentaires constructifs au formulaire pour que l'utilisateur les lise. N'oubliez pas d'intercepter l'événement de pression de touche et d'empêcher l'envoi du formulaire lorsque vous appuyez sur Entrée, car il contournera votre fonction de validation.

Et, euh, une suggestion: il vaudrait peut-être mieux faire toutes les validations côté client, ce qui est généralement suffisant. Vous avez probablement entendu que la validation côté client peut être contournée, donc il est toujours nécessaire de vérifier le serveur. Cependant, j'ai toujours l'impression que si un utilisateur décide de jouer avec le système au sérieux, il n'est pas nécessaire de fournir des commentaires constructifs. Un message simple indiquant l'échec suffira. Donc, vérifiez d'abord l'entrée avec Javascript simple. Si quelque chose ne va pas, donnez votre avis. Si, toutefois, le serveur reçoit une entrée non valide (ce qui signifie que la validation côté client a été ignorée), informez simplement l'utilisateur qu'il a échoué.

+0

Merci!Le problème dans mon cas avec la validation côté client, c'est qu'il ne peut pas vérifier si l'utilisateur existe dans la base de données :) Je l'ai fonctionné maintenant, mais je suis toujours perplexe quant à pourquoi Firefox (ne l'ai pas testé sur d'autres navigateurs, mais je soupçonne que la même chose se produira) n'aime pas ajouter

0

vous pouvez utiliser quelque chose comme:

onClick='javascript: return myValidationFuncion() 

Si votre fonction serait de vérifier si la valeur est valide, à savoir faire votre appel de service web là-bas. Si les valeurs ne sont pas valides, il suffit de retourner false pour arrêter l'exécution.

K

+0

Merci, ce retour m'a sauvé la vie –

Questions connexes