Se connecter / S'enregistrer

Résolu Validation des champs d'un formulaire Jquery

Solutions (7)
Tags :
  • Jquery
  • Mot de passe
  • Programmation
|
bonjour,
J'ai crée un formulaire avec Jquery avec une fonction $("#nomformulaire").validate
pour la validation des champs des formaulaires et une fonction $("#nomformulaire").submit( function() pour l'envoi des données vers un fichier php pour qu'ils seront enregistrés dans la Base de données.
Mais le problème ce que même en présence d'un message d'erreur du validation (par exemple un champ manquant) les données seront ajoutées à la base de données.
Je veux savoir comment faire pour n'envoyer les données qu'après la vérification.
voici le code de la fonction .submit(function):

  1. $.ajax({
  2. type: "POST",
  3. url: "essaiPHP.php",
  4. data:"Nom="+$("#Nom").val()+"&Prenom="+$("#Prenom").val()+"&telephone="+$("#telephone").val()+"&login="+$("#login").val()+"&mdp_Cl="+$("#mdp_Cl").val(),
  5. success: function(){
  6. alert("Vous êtes inscrits! "+$("#Nom").val());
  7. }
  8. });
  9. return false;

merci pour votre aide
Contenus similaires
Meilleure solution
partage
|
Il suffit de rajouter le paramètre submitHandler dans le lot, et mettre cette initialisation au "document.ready" comme je l'ai fait.

Ça donne ça :

  1. $(function() {
  2. $("#signupForm").validate({
  3. rules: {
  4. Nom: "required",
  5. Prenom: "required",
  6. telephone:{
  7. required: true,
  8. minlength: 2
  9. },
  10. login: "required",
  11. mdp_Cl: "required",
  12. mdp2_Cl: {
  13. equalTo: "#mdp_Cl"
  14. },
  15. },
  16. messages: {
  17. Nom: "Entrez votre nom svp",
  18. Prenom: "Entrez votre prénom svp",
  19. telephone: {
  20. required: "Entrez votre telephone svp",
  21. minlength: "Votre numero de telephone doit comprendre au minimum 2 chiffres"
  22. },
  23. login:"Entrez votre login svp",
  24. mdp_Cl: "Entrez un mot de passe",
  25. mdp2_Cl: "Le mot de passe n'est pas identique",
  26. },
  27. submitHandler: function(form) {
  28. $.ajax( { type: "POST",
  29. url: "essaiPHP.php",
  30. data:"Nom="+$("#Nom" ).val()+"&Prenom="+$("#Prenom").val()+"&telephone="+$("#telephone" ).val()+"&login="+$("#login").val()+"&mdp_Cl="+$("#mdp_Cl" ).val(),
  31. success: function() {
  32. alert("Vous êtes inscrits! "+$("#Nom" ).val());
  33. }
  34. });
  35. }
  36. });
  37. });

  • Commenter cette solution |
Score
0
òh
òi
|
Meilleure réponse sélectionnée par sab ri.
  • Commenter cette réponse |
Score
0
òh
òi
|
merci
  • Commenter cette réponse |
Score
0
òh
òi
|
voici le code de validation des champs:
  1. $("#signupForm").validate({
  2. rules: {
  3. Nom: "required",
  4. Prenom: "required",
  5. telephone:{
  6. required: true,
  7. minlength: 2
  8. },
  9. login: "required",
  10. mdp_Cl: "required",
  11. mdp2_Cl: {
  12. equalTo: "#mdp_Cl"
  13. },
  14. },
  15. messages: {
  16. Nom: "Entrez votre nom svp",
  17. Prenom: "Entrez votre prénom svp",
  18. telephone: {
  19. required: "Entrez votre telephone svp",
  20. minlength: "Your telephone must consist of at least 2 characters"
  21. },
  22. login:"Entrez votre login svp",
  23. mdp_Cl: "Entrez un mot de passe",
  24. mdp2_Cl: "Le mot de passe n'est pas identique",
  25. }
  26. });
  • Commenter cette réponse |
Score
0
òh
òi
|
Ok, vu que tu utilises bien le plugin de validation, voila ce qu'il faut mettre dans ton fichier JS :

  1. $(function() {
  2. $("#nomformulaire").validate({
  3. submitHandler: function(form) {
  4. $.ajax( { type: "POST",
  5. url: "essaiPHP.php",
  6. data:"Nom="+$("#Nom" ).val()+"&Prenom="+$("#Prenom").val()+"&telephone="+$("#telephone" ).val()+"&login="+$("#login").val()+"&mdp_Cl="+$("#mdp_Cl" ).val(),
  7. success: function() {
  8. alert("Vous êtes inscrits! "+$("#Nom" ).val());
  9. }
  10. });
  11. }
  12. });
  13. });


Cela permet d'initialiser le formulaire à la fin du chargement de la page.

Pour info, le plugin validation fonctionne en vérifiant que les champs avec la classe "required" sont bien rempli, donc n'oublie pas de spécifier tes inputs avec class="required"

Normalement ça devrait bien fonctionner.
  • Commenter cette réponse |
Score
0
òh
òi
|
oui c bien ça le problème, j'ai utilisé le plugin de validation de Jquery.
Merci pour votre réponse et je vais essayé ton code
  • Commenter cette réponse |
Score
0
òh
òi
|
Bonjour,

Pourrais-tu utiliser les balises BB pour le code ([c[#000000]od[/#x]e][#ff0000]... ton code source ici ...[/#x][[#000000]/cod[/#x]e]) s'il te plaît, on y verra plus clair.

Alors, pour être sur de bien comprendre, ton code pour la fonction "submit" est le suivant :

  1. $('#nomformulaire').submit(function() {
  2. $.ajax( { type: "POST",
  3. url: "essaiPHP.php",
  4. data:"Nom="+$("#Nom" ).val()+"&Prenom="+$("#Prenom").val()+"&telephone="+$("#telephone" ).val()+"&login="+$("#login").val()+"&mdp_Cl="+$("#mdp_Cl" ).val(),
  5. success: function() {
  6. alert("Vous êtes inscrits! "+$("#Nom" ).val());
  7. }
  8. });
  9. return false;
  10. });


Si c'est ça, alors c'est mauvais, dans la fonction du "submit" il faut vérifier tes champs.

Tu dis utiliser la fonction "validate", s'agit-il du plugin de validation suivant : Plugins/Validation JQuery.

Si oui, alors il ne faut pas déclarer ta fonction "submit" comme je l'ai fais ci-dessus, mais comme cela :

  1. $("#nomformulaire").validate({
  2. submitHandler: function(form) {
  3. $.ajax( { type: "POST",
  4. url: "essaiPHP.php",
  5. data:"Nom="+$("#Nom" ).val()+"&Prenom="+$("#Prenom").val()+"&telephone="+$("#telephone" ).val()+"&login="+$("#login").val()+"&mdp_Cl="+$("#mdp_Cl" ).val(),
  6. success: function() {
  7. alert("Vous êtes inscrits! "+$("#Nom" ).val());
  8. }
  9. });
  10. }
  11. })


Lis bien les docs sur le site de JQuery.

Si je me trompe complètement, alors ton explication est vraiment pas clair, et je te demanderais de nous montrer tout ton code (ton fichier JS et HTML correspondant).
  • Commenter cette réponse |

Ce n'est pas ce que vous cherchiez ?

Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS