contrôle de champs de formulaire

Version imprimable

Bonjour à tous.

Je viens sur ce forum aujourd'hui pour avoir un peu d'aide. Je travail sur un projet concernant une application html/php/JS de gestion de stage et je galère avec les contrôles des champs de formulaire.

Côté JS cela donne ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
<script language="Javascript">
	function controleFormulaire()
	{
		var nom = document.NE.Nom.value;
		if (formulaire.nom==""){
			return false; // et le formulaire n'est pas envoyé
			alert("Veuillez remplir le champ Nom !");}
			else
			return true; // et le formulaire est envoyé
		var SectAct = document.NE.Sect_Act.value;
		if (formulaire.SectAct==""){
			return false; 
			alert("Veuillez remplir le champ Secteur d\'activité !");}
			else
			return true; 
		var adresse = document.NE.Adresse.value;
		if (formulaire.adresse==""){
			alert("Veuillez remplir le champ Adresse");
			return false; }
			else
			return true; 
		var cp = document.NE.CP.value;
		if (formulaire.cp==""){
			return false; 
			alert("Veuillez remplir le champ Code Postal");}
			else
			return true; 
		var ville = document.NE.Ville.value;
		if (formulaire.Ville==""){
			return false;
			alert("Veuillez remplir le champ Ville");}
			else
			return true;
		var tel = document.NE.Tel.value;
		if (formulaire.tel==""){
			return false; 
			alert("Veuillez remplir le champ Téléphone");}
			else
			return true; 
	}
 
	</script>

Côté HTML j'ai ceci :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
     <form name="NE" method="post" action="Transfert_NE.php" onsubmit="return formOK();">
     	<table>
			<tr><td><label for="Nom">Nom *:</label></td> <td><input type="text" name="Nom"/></td></tr>
			<tr><td><label for="Sect_Act">Secteur d'activite *:</label></td> <td><input type="text" name="Sect_Act"/></td></tr>
			<tr><td><label for="Type">Type :</label></td> <td><input type="text" name="Type"/></td></tr>
			<tr><td><label for="Adresse">Adresse *:</label></td> <td><input type="text" name="Adresse"/></td></tr>
			<tr><td><label for="CP">Code postal *:</label></td> <td><input type="text" name="CP" size="5"/></td></tr>
			<tr><td><label for="Ville">Ville *:</label></td> <td><input type="text" name="Ville"/></td></tr>
			<tr><td><label for="Tel">Telephone *:</label></td> <td><input type="text" name="Tel"/></td></tr>
			<tr><td><label for="Fax">Fax :</label></td> <td><input type="text" name="Fax"/></td></tr>
			<tr><td><label for="Email">E-mail :</label></td> <td><input type="text" name="Email"/></td></tr>
			<tr><td><label for="Site">Site web :</label></td> <td><input type="text" name="Site"/></td></tr>
		</table>
 
		<input type="submit" value="Enregistrer"></input>
		<input type="reset" value="Effacer"></input>
     </form>
<h6>* : Champs obligatoires</h6><br/><br/>

Mon problème est le suivant : Il semblerait que les contrôles ne soient pas fait, et les données sont biens envoyées dans la base, alors qu'elle ne le doivent pas.

D'avance, merci pour votre aide ! :ccool:

07/06/2012, 14h25
SpaceFrog

Si on les mets l'un a coté de l'autre ...

Code:

onsubmit="return formOK();"

Code:

function controleFormulaire()

ajoute a cela le fait que tu fais un return true il envoie ...

mets une variable boolean à false en debut de fonction , modifies là à true dans les tests
et ne fais un return qu'une fois en fin de fonction
07/06/2012, 14h29
Spir29

Oula oui, en effet. Malheureusement, après correction, le problème reste le même.
07/06/2012, 14h31
SpaceFrog

post pécédent édité
07/06/2012, 14h41
Bovino
Code:

onsubmit="return formOK();"

Code:

function controleFormulaire()

:koi:

C'est mes yeux ou il y a un truc qui cloche ? :?
Code:

1 2 var nom = document.NE.Nom.value; if (formulaire.nom==""){
Heu... là, j'ai beau essayer de chercher, mais je vois vraiment pas la logique...
Ton objet formulaire, il sort d'où ??? Et tu es sûr de vouloir vérifier le champ dont le name correspond au value d'un autre champ ???
07/06/2012, 14h46
Spir29

Pour le premier problème que tu signales Bovino, ça a été corrigé grâce à SpaceFrog. Mais merci pour l'autre problème, j'ai ENFIN les messages d'erreurs. Je débute en JS et je suis allé chercher un peu partout des solutions, qui après trois heures de tentatives se sont mélangées.

Mais le soucis est résolu, juste que les données sont envoyées dans la base quand il manque des champs.

Merci déjà à tout les deux.
07/06/2012, 14h48
SpaceFrog

Jette un oeil par là http://www.developpez.net/forums/d55...on-formulaire/
07/06/2012, 14h53
Bovino
Citation:

juste que les données sont envoyées dans la base quand il manque des champs.

C'est normal, dans ton code, tu as
Code:

1 2 3 4 5 if (formulaire.nom==""){ return false; // et le formulaire n'est pas envoyé alert("Veuillez remplir le champ Nom !");} else return true; //
Ce que Spaffy a essayé de t'expliquer, c'est qu'un return stoppe l'exécution de la fonction en cours, du coup, tu ne vérifies que le premier champ !
Supprime tous ces return true et rajoutes-en un unique à la fin de la fonction : si elle est arrivée jusque là, c'est qu'elle n'a pas rencontré de return (donc false) et que tous les champs sont corrects, donc tu peux envoyer.

Oui, j'ai bien compris l'histoire des return en trop, cela a été modifier. Je me suis inspiré de la FAQ que vient de me donner SpaceFrog ce mon JS donne ceci :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
function controleFormulaire()
	{
		var verif = 0; //Passe à true si champ vide
		var nom = document.NE.Nom.value;
		if (nom==""){
			verif++; 
			alert("Veuillez remplir le champ Nom !");}
		var SectAct = document.NE.Sect_Act.value;
		if (SectAct==""){
			verif++; 
			alert("Veuillez remplir le champ Secteur d\'activite !");}
		var adresse = document.NE.Adresse.value;
		if (adresse==""){
			alert("Veuillez remplir le champ Adresse !");
			verif++; }
		var cp = document.NE.CP.value;
		if (cp==""){
			verif++; 
			alert("Veuillez remplir le champ Code Postal !");} 
		var ville = document.NE.Ville.value;
		if (ville==""){
			verif++;
			alert("Veuillez remplir le champ Ville !");}
		var tel = document.NE.Tel.value;
		if (tel==""){
			verif++;
			alert("Veuillez remplir le champ Telephone !");}
		if (verif==0) 
			return true;
		else
			return false;
	}

07/06/2012, 15h04
SpaceFrog

utilise une syntaxe correcte

Code:

var nom = document.NE.Nom.value;

:nono:

Code:

var nom = document.forms['NE'].elements['Nom'].value;

ou avec les id

Code:

var nom = document.getElementById('idchmapsNom').value;