Javascript: l'alerte ne se lance pas(formulai

Fermé

steeff - 24 avril 2011 à 21:02
steeff - 28 avril 2011 à 17:48

Bonjour,

J'ai un problème avec ma fonction de vérification de formulaire, qui ne se lance pas quand le formulaire est incomplet. En fait aucune alerte n'apparait quand on rempli pas les champs.

Il me manque surement quelque chose, mais je n'arrive pas à trouver quoi.... J'espere vraiment que vous pourrez m'aider.

Voici mon code actuel :

PARTIE FONCTION :

<script type="text/javascript">

// Traitement de l'insertion d'un message avec vérification des champs
//----------------------------------------------------------

// Fonctions de vérification

function Vide($Element)
{
return trim($Element) == "";
}

function is_alpha(Element)
{
pattern = /^[a-zA-Z'éèêëàâäùüûôöîïç]{1}[a-zA-Z'éèêëàâäùüûôöîïç, -]+[a-zA-Z'éèêëàâäùüûôöîïç]{1}$/
return pattern.test(Element.value)
}

function verifForm(form)
{
var msg = 'Merci bien de vouloir renseigner les champs suivants :\n';
var valide = true;
with (document) {
if (Vide(getElementById('nom')) || !is_alpha(getElementById('nom'))) {
getElementById('Lnom').className = 'erreur';
msg += '\t- le nom\n';
valide = false;
}
else {
getElementById('Lnom').className = '';
}
if (getElementById('prenom').value == '' || !is_alpha(getElementById('nom'))) {
getElementById('Lprenom').className = 'erreur';
msg += '\t- le prénom\n';
valide = false;
}
else {
getElementById('Lprenom').className = '';
}

msg += 'Les champs mals renseignés apparaissent en rouge\n';
}
if (!valide) {
alert(msg);
}
return valide;
}

</script>

PARTIE FORMULAIRE :

<form onsubmit="return verifForm(this);" method="post" action="formulaire_post.php"> 
<fieldset> 
<legend>EXPRIMEZ-VOUS !</legend> 
<p>
<label for="nom" id="Lnom">Nom :</label>
<input type="text" name="nom" id="nom" value="" />
</p>
<p>
<label for="prenom" id="Lprenom">Prénom :</label>
<input type="text" name="prenom" id="prenom" value="" />
</p>
<p>
<label for="adresse"id="Ladresse">Adresse :</label>
<textarea name="adresse" id="adresse"></textarea>
</p>
<p>
<label for="ville" id="Lville">Ville :</label>
<input type="text" name="ville" id="ville"/>
</p>
<p>
<label for="pays" id="Lpays">Pays / Province :</label>
<input type="text" name="pays" id="pays" value="" />
</p>
<p>
<label for="email" id="Lemail">email :</label>
<input type="text" name="email" id="email" value="" />
</p>
<p>
<label for="message" id="Lmessage">Votre message :</label>
<textarea name="message" id="message" rows="10" cols="50"></textarea>
</p>

</fieldset>
<p id="action"><input type="submit" name="action" value="Envoyer" /></p>
</form>

A voir également:

Javascript: l'alerte ne se lance pas(formulai
Telecharger javascript - Télécharger - Langages
Javascript void 0 c'est quoi ✓ - Forum Réseaux sociaux
Echo javascript ✓ - Forum PHP
Javascript obfuscator - Télécharger - Langages
Retour à la ligne javascript ✓ - Forum Javascript

15 réponses

Réponse 1 / 15

informaticienSAP Messages postés 119 Date d'inscription jeudi 21 avril 2011 Statut Membre Dernière intervention 17 décembre 2011 20
Modifié par informaticienSAP le 25/04/2011 à 16:15

Bonjour,

tu as bien avancé, c'est signe de grande volonté. C'est bien.

As-tu testé ce que renvoies ta fonction ?

en faisant un :

      Alert (!VerifMail(getElementById('email')))

Encore, une fois, il faut debugger instruction par instruction. Ici, on attaque directement sur ta fonction "VerifMail" car à priori c'est de la que vient l'anomalie. Alors, vérifions dans un premier temps, le code retour ...

On est pas loin de la vérité ;)

ps: avec le temps et de l'accoutumance, tu pourras débugger de tête sans mettre des Alert partout et du "debugging by step" suivant plusieurs useCase. Aujourd'hui, tu passes par là mais demain, tu pourras coder pendant des heures et des heures, et en exécutant une seule fois, ton code marchera nickel ... Bon courage, t'as la volonté pour !

Réponse 2 / 15

steeff
Modifié par steeff le 24/04/2011 à 23:18

Excusez moi, c'est un peu dur à lire comme ça..
Je le réécris de façon plu lisible :)

PARTIE FORMULAIRE :

<form onsubmit="return verifForm(this);" method="post" action="formulaire_post.php">  
        <fieldset>  
                <legend>EXPRIMEZ-VOUS !</legend> 
                <p> 
                        <label for="nom" id="Lnom">Nom :</label> 
                        <input type="text" name="nom" id="nom" value="" /> 
                </p> 
                <p> 
                        <label for="prenom" id="Lprenom">Prénom :</label> 
                        <input type="text" name="prenom" id="prenom" value="" /> 
                </p> 
                <p> 
                        <label for="adresse"id="Ladresse">Adresse :</label> 
                        <textarea name="adresse" id="adresse"></textarea> 
                </p>                         
                <p> 
                        <label for="ville" id="Lville">Ville :</label> 
                        <input type="text" name="ville" id="ville"/> 
                </p>                         
                <p> 
                        <label for="pays" id="Lpays">Pays / Province :</label> 
                        <input type="text" name="pays" id="pays" value="" /> 
                </p>                         
                <p> 
                        <label for="email" id="Lemail">email :</label> 
                        <input type="text" name="email" id="email" value="" /> 
                </p> 
                <p> 
                        <label for="message" id="Lmessage">Votre message :</label> 
                        <textarea name="message" id="message" rows="10" cols="50"></textarea> 
                </p>                         
                         
        </fieldset> 
        <p id="action"><input type="submit" name="action" value="Envoyer" /></p> 
</form>

PARTIE FONCTION :

// Traitement de l'insertion d'un message avec vérification des champs //---------------------------------------------------------- 
                 
 // Fonctions de vérification 
    function Vide($Element) 
     { 
         return trim($Element) == ""; 
      } 
         
     function is_alpha(Element) 
     { 
       pattern = /^[a-zA-Z'éèêëàâäùüûôöîïç]{1}[a-zA-Z'éèêëàâäùüûôöîïç, -]+[a-zA-Z'éèêëàâäùüûôöîïç]{1}$/ 
         return pattern.test(Element.value) 
      }         
         
     function verifForm(form) 
     { 
        var msg = 'Merci bien de vouloir renseigner les champs suivants :\n'; 
        var valide = true; 
        with (document) { 
              if (Vide(getElementById('nom')) || !is_alpha(getElementById('nom'))) { 
                         getElementById('Lnom').className = 'erreur'; 
                          msg += '\t- le nom\n'; 
                          valide = false; 
                 }  
                 else { 
                          getElementById('Lnom').className = ''; 
                         } 
             if (getElementById('prenom').value == ''  || !is_alpha(getElementById('nom'))) { 
                       getElementById('Lprenom').className = 'erreur'; 
                       msg += '\t- le prénom\n'; 
                       valide = false; 
               }  
               else { 
                         getElementById('Lprenom').className = ''; 
                       } 
              msg += 'Les champs mals renseignés apparaissent en rouge\n';  
           } 
          if (!valide) { 
                alert(msg); 
          } 
   return valide; 
        }

Voila, je pense que c'est mieux comme ça :)
J'espere que vous pourrez m'aider.
Je vous remercie d'avance. :)

Réponse 3 / 15

informaticienSAP Messages postés 119 Date d'inscription jeudi 21 avril 2011 Statut Membre Dernière intervention 17 décembre 2011 20
Modifié par informaticienSAP le 24/04/2011 à 23:22

Méthode de debuggage:

Tu refais ton formulaire avec un seul champ et tu testes.

Parce qu'avec tout ce code, j'ai (et beaucoup de gens), n'ont pas envie de lire ça un dimanche à 23h20.

Si tu bloques, recopie ton code afin qu'on puisse t'aider.

Réponse 4 / 15

steeff
24 avril 2011 à 23:41

Oui je comprend. ;)

Alors je vais garder le champs nom, et la fonction qui est sensée envoyer le message d'alerte. Ça donne ça :

PARTIE FORMULAIRE :

<form onsubmit="return verifForm(this);" method="post" action="formulaire_post.php">  
        <fieldset>  
                <legend>EXPRIMEZ-VOUS !</legend> 
                <p> 
                        <label for="nom" id="Lnom">Nom :</label> 
                        <input type="text" name="nom" id="nom" value="" /> 
                </p>

PARTIE FONCTION :

// Traitement de l'insertion d'un message avec vérification des champs //----------------------------------------------------------
     function verifForm(form) 
     { 
        var msg = 'Merci bien de vouloir renseigner les champs suivants :\n'; 
        var valide = true; 
        with (document) { 
              if (Vide(getElementById('nom')) || !is_alpha(getElementById('nom'))) { 
                         getElementById('Lnom').className = 'erreur'; 
                          msg += '\t- le nom\n'; 
                          valide = false; 
                 }  
               else { 
                        getElementById('Lnom').className = ''; 
                       } 

              if (!valide) { 
                  alert(msg); 
              } 
       return valide; 
      }

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 15

informaticienSAP Messages postés 119 Date d'inscription jeudi 21 avril 2011 Statut Membre Dernière intervention 17 décembre 2011 20
24 avril 2011 à 23:45

Méthode de debuggage :

1) tu peux tester juste ça avant :

     function verifForm(form) 
     { 
       alert(msg); 
      }

2) Ensuite :

    function verifForm(form) 
     { 
        var msg = 'Merci bien de vouloir renseigner les champs suivants :\n'; 
        var valide = true; 
        with (document) { 
              if (Vide(getElementById('nom')) || !is_alpha(getElementById('nom'))) { 
                          alert('0');  
                          valide = false; 
                 }  
               else { 
                        alert('1');  
                       } 

              if (!valide) { 
                  alert('2'); 
              } 
       return valide; 
      }

Merci.

Réponse 6 / 15

steeff
Modifié par steeff le 24/04/2011 à 23:59

En testant le 1) ça n'envoie aucune alerte... :x
Je me demande si je fais bien appel à la fonction comme il faut ?

Pour ça j'ai cette ligne de code là :
<form onsubmit="return verifForm(this);" method="post" action="formulaire_post.php">

Est ce qu'il me manque quelque chose ? ou faut-il procéder autrement ?

Réponse 7 / 15

steeff
25 avril 2011 à 00:13

C'est bon pour le 1).

Après ajout de simple quote, le 1) fonctionne bien.

Ou en ajoutant la ligne : "var msg = 'Merci bien de vouloir renseigner les champs suivants ", et en retirant les simple quote.

Mais le 2) ne fait aucune alerte.

Réponse 8 / 15

informaticienSAP Messages postés 119 Date d'inscription jeudi 21 avril 2011 Statut Membre Dernière intervention 17 décembre 2011 20
Modifié par informaticienSAP le 25/04/2011 à 00:23

    function verifForm(form)    
     {    
        var msg = 'blabla';    
        var valide = true;    
        with (document) {    
             alert('3');     
       return valide;    
           }
      }

Réponse 9 / 15

steeff
25 avril 2011 à 00:28

Celui-ci fonctionne, il envoie bien "3" en message d'alerte

Réponse 10 / 15

informaticienSAP Messages postés 119 Date d'inscription jeudi 21 avril 2011 Statut Membre Dernière intervention 17 décembre 2011 20
Modifié par informaticienSAP le 25/04/2011 à 00:36

Donc, après avoir ciblé tout les points "sensibles", on en déduit que l'erreur ne peut venir que de :

if (Vide(getElementById('nom')) || !is_alpha(getElementById('nom')))

Essaie de reproduire la même méthode de debuggage en épurant ta condition :

1)
if ( !is_alpha(getElementById('nom')) Alert ...

2)

 if (Vide(getElementById('nom')))    
   Alert ...

Ect ...

T'es pas loin de trouver.

ps: c'est pas Empty pour tester si une chaine est vide en php ?

Réponse 11 / 15

steeff
25 avril 2011 à 00:35

Ok, je vais essayer :)
Merci bien :)

Tu restes dans le coin si j'ai du mal ?

Réponse 12 / 15

informaticienSAP Messages postés 119 Date d'inscription jeudi 21 avril 2011 Statut Membre Dernière intervention 17 décembre 2011 20
Modifié par informaticienSAP le 25/04/2011 à 00:37

Poste tes messages, si il y a quelqu'un tu auras une réponse.

Bon courage.

ps: c'est pas Empty() pour tester si une chaine est vide en php ?

Réponse 13 / 15

steeff
Modifié par steeff le 25/04/2011 à 00:50

Oui y a Empty() pour le php, mais en javascript je sais pas...

Il me semble que Empty c'est pour vérifier si une variable existe ou non, alors que là je cherche à vérifier que la variable n'est pas vide (donc par exemple, ce n'est pas un espace...).

Merci pour le temps que tu me conssacre :)

Réponse 14 / 15

steeff
25 avril 2011 à 01:58

Petit souci :

J'ai bien avancé, en vérifiant petit à petit que ça fonctionne. J'ai augmenté le nombre de champs, et le bon message s'affiche selon les champs manquants. Avec ce code-ci :

   function verifForm(form)     
     {    
        var msg = 'blabla';    
        var valide = true;    
        with (document) {    
             if (!is_alpha(getElementById('nom')) || Vide(getElementById('nom'))) { 
                     msg += '\t- le nom \n';  
                     valide = false; 
                 } 
			 if (!is_alpha(getElementById('prenom')) || Vide(getElementById('prenom'))) { 
                     msg += '\t- le prenom \n';  
                     valide = false; 
                 } 	 
			 if (!is_alpha(getElementById('email')) || Vide(getElementById('email'))) { 
                     msg += '\t- l\'email \n';  
                     valide = false; 
                 } 
				 
	/*		 if (!VerifMail(getElementById('email'))) { 
                     msg += 'Attention : votre email est inccorect. \n';  
                     valide = false; 
                 } 
        */
			
			if (!valide) {
				alert(msg);
				}
			else {
			alert('ok');
				}
       return valide;    
           }
      }

Mais quand j'ajoute ce que j'ai mis entre /* et */, il n'y a plus aucun message d'alerte.
Je ne comprend pas pourquoi cela empêche les messages de s'afficher, car ce n'est qu'un "if", une condition qui n'empêche pas de réaliser les instructions qui suivent en ayant bien refermer l'accolade...

Voici la fonction VerifMail :

function VerifMail(form)
{
	getElementById('email')
	var reg = new RegExp('^[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*@[a-z0-9]+([_|\.|-]{1}[a-z0-9]+)*[\.]{1}[a-z]{2,6}$', 'i');
	if(reg.test(mailteste))
	{
		return(true);
	}
	else
	{
		return(false);
	}
}

Je vous remercie d'avance pour votre aide.

Réponse 15 / 15

steeff
28 avril 2011 à 17:48

Sa y est ça fonctionne correctement. :)
J'avais en fait un problème avec une variable.

Merci pour l'aide, le temps accordé, et la rapidité des réponses :)

Discussions similaires

Javascript Arrondi à 2 chiffres après la virgule

java script error in the main process

afficher un tableau JS en HTML

Nodejs.exe est-ce un virus

[Javascript] Tables de Multiplication

Discussions similaires

Newsletters