onsubmit pour tester si champs formulaire vides

Version imprimable

Bonjour,

j'ai fais un simple formulaire permettant de saisir un nom ( que j'appelle nom de domaine)

Pour tester si la valeur du formulaire est vide ou pas j'utilise onsubmit de la balise <form>. Cependant même quand je ne rentre rien le formulaire est envoyé : pas de message indiquant à l'utilisateur que le champs n'a pas été rempli.
Je ne sais pas ce qui ne va pas avec mon code .

le voici :
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 <!doctype html> <html> <head> <title>creationDomaine</title> </head> <body> <h2>Remplissage formulaire creation domaine</h2> <form id="formSaisie" method="post" action="actionDomaine.php" onsubmit="return valider();"> <table> <tr> <td>nom de domaine : <input type="text" name="nomDomaine" /></td> <td><input type="submit" value="valider" name="valider"></td> </tr> </table> </form> <SCRIPT LANGUAGE="JAVASCRIPT">  </body> </html>
j'ai même essayer de placer le code JavaScript dans un autre fichier et de l'appeler avec
Code:

1 2 <SCRIPT type="text/javascript" src="MonDocument.js"> </SCRIPT>
mais rien (quoi que je ne sais pas s'il faudrait dans ce cas spécifier le chemin de la fonction valider ou pas :( )

Pourriez vous me dire pourquoi ça ne marche pas.

Merci d'avance pour votre aide.

25/02/2013, 17h47
Bovino

document.forms['formSaisie'] recherche le formulaire dont l'attribut name vaut "formSaisie". Dans ton cas, il n'y en a pas !
Ceci dit, puisque tu donnes un id a ton formulaire, il serait préférable d'utiliser getElementById()...
25/02/2013, 17h57
Xeuch
Merci de votre aide

je l'ai utilisé comme ça maintenant
Code:

1 2 3 4 if(getElementById()['nomDomaine'].value != ""){ // envoyer le formulaire return true; }
Mais ça ne marche toujours pas.
Est ce que c'est comme ça qu'il faut que je l'écrive ?

Merci d'avance
25/02/2013, 18h05
Bovino

Je t'ai indiqué le nom de la méthode à utiliser afin que tu te renseignes sur la façon de l'utiliser... En l'occurrence, ce que tu as écris ne correspond à rien ! :aie:
25/02/2013, 18h19
Xeuch

Merci,
je vais le regarder donc :ccool:
26/02/2013, 08h24
SpaceFrog

Un peu de lecture ...

http://www.developpez.net/forums/d55...on-formulaire/

Merci SpaceFrog

j'ai adapté mon code comme sur le tuto que vers lequel tu ma dirigé mais j'ai toujours pareil le formulaire est envoyé même si je ne mets rien et je ne sais pas pourquoi ?
voici le code

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
<!doctype html>
<html>
<head> 
<title>creationDomaine</title> 
 
 
<SCRIPT type='text/javascript'>
	var $cptErreur=0;
	// si la valeur du champ domaine est vide
	if(document.forms['formSaisie'].elements['nomDomaine'].value == "") {
		//on envoi une alerte
		alert("veuillez entrez le nom de domaine svp");
		//Ne pas envoyer le formulaire
		//return false;
		$cptErreur++;
	}
	else {
	// sinon on envoi le formulaire
		$cptEreur++;
	}
	return(cptErreur==0);
	// Equivaut à dire que if(cptErreur==0){return $true;}else{return false;}
</script>
</head> 
	<body> 
		<h2>Remplissage formulaire creation domaine</h2> 
			<form name="formSaisie" method="post" action="actionDomaine.php" onsubmit="return valider()">
			<table>
				<tr>
					<td>nom de domaine : <input type="text" name="nomDomaine" value='' /></td>
					<td><input type="submit" value="valider" name="valider"></td>
				</tr>
			</table>
			</form>		
 
</body> 
</html>

Merci

26/02/2013, 10h23
Bovino

T'as pas l'impression qu'il manque une définition de fonction dans ton code ? :roll:

Merci je ne suis même pas rendu compte :(

Cependant j'ai toujours pareil

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
<!doctype html>
<html>
<head> 
<title>creationDomaine</title> 
 
<SCRIPT type='text/javascript'>
function valider(){
	var $cptErreur=0;
	// si la valeur du champ domaine est vide
	if(document.forms['formSaisie'].elements['nomDomaine'].value == "") {
		//on envoi une alerte
		alert("veuillez entrez le nom de domaine svp");
		//Ne pas envoyer le formulaire
		//return false;
		$cptErreur++;
	}
	else {
	// sinon on envoi le formulaire
		$cptEreur++;
	}
	return(cptErreur==0);
	// Equivaut à dire que if(cptErreur==0){return $true;}else{return false;}
}
</script>
</head> 
<body> 
	<h2>Remplissage formulaire creation domaine</h2> 
	<form name="formSaisie" method="post" action="actionDomaine.php" onsubmit="return valider()">
		<table>
			<tr>
				<td>nom de domaine : <input type="text" name="nomDomaine" value='' /></td>
				<td><input type="submit" value="valider" name="valider"></td>
			</tr>
		</table>
	</form>		
</body> 
</html>

26/02/2013, 10h37
Bovino

Disons que si tu incrémentes $cptErreur dans tous les cas de figure, il y a peu de chance pour qu'il puisse retourner 0 (équivalent de false) à la fin de la fonction... donc ton formulaire est toujours soumis.

merci
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 <!doctype html> <html> <head> <title>creationDomaine</title> <SCRIPT type='text/javascript'> function valider(){ //var $cptErreur=0; // si la valeur du champ domaine est vide if(document.forms['formSaisie'].elements['nomDomaine'].value == "") { //on envoi une alerte alert("veuillez entrez le nom de domaine svp"); //Ne pas envoyer le formulaire return false; //$cptErreur++; } else { // sinon on envoi le formulaire //$cptEreur++; return true; } //return(cptErreur==0); // Equivaut à dire que if(cptErreur==0){return $true;}else{return false;} } </script> </head> <body> <h2>Remplissage formulaire creation domaine</h2> <form name="formSaisie" method="post" action="actionDomaine.php" onsubmit="return valider()"> <table> <tr> <td> <label for="nomDomaine">nom de domaine</label> : <input type="text" name="nomDomaine" value='' id="nomDomaine" /></td> <td><input type="submit" value="valider" name="valider"></td> </tr> </table> </form> </body> </html>
Même en faisant plus simple avec un return true ou return false ça ne change rien.
Peut être faudrait-je essayer de placer je JS dans un autre fichier et de l'appeler ?
et dans ce cas si je met
<SCRIPT type="text/javascript" src="leScript.js"></SCRIPT> dans mon fichier html je ne sais pas s'il faudrait spécifier le chemin de ma fonction valider() ou pas?
car peut être c'est du à la version du navigateur je dois utiliser internet explorer pour mon application

26/02/2013, 11h04
SpaceFrog

il y a peut etre conflit entre le name de ton bouton et le nom de la fonction .
26/02/2013, 15h30
Xeuch

Merci beaucoup c'était ça le problème.
ça marche maintenant :ccool: