Formulaire vérification js

Fermé
AMARI - 27 févr. 2013 à 11:29
 AMARI - 27 févr. 2013 à 14:16
Bonjour,
J'ai un formulaire et je veux le vérifier en js pour les champs "Input" ça marche la verfication par contre pour la liste déroulante ça marcha pas :( quelqu'un peux m'aider et je veux aussi afficher un message si tous les champs sont vide .

voilà mon code js
function verifValeur(formulaire) {
var formulaire = document.getElementById("monForm")
if (formulaire.cof_eau_du_sol.value == "")
{
alert ("Veuillez saisir le cof");
return false;
}

if(formulaire.niv_de_debordement.value == ""){
alert ("Veuillez saisir le niveau de debordement");
return false;
}

if(formulaire.taux_concentration.value == "") {
alert ("Veuillez saisir le taux de concentration");
return false;
}

if (formulaire.pour_etanchite.value == ""){
alert ("Veuillez saisir le porcentage d'enchite d'eau");
return false;
}
if (formulaire.niv_depart.value == ""){
alert ("Veuillez saisir le niveau de deaprt");
return false;
}

if(formulaire.sal_sol.value == ""){
alert ("Veuillez saisir la salinité de sol ");
return false;
}
if(document.getElementById("origine_iragation").value == "") {
alert("Veuillez saisir l'origine d'iragation!");
return false;
}}
et voilà mon code de formulaire Html:
<form action="valeur.php" method="post" name="formulaire" id="monForm" onSubmit="return verifValeur(formulaire)" >
<table width="350" border="0" align="center" cellpadding="5" cellspacing="0" bgcolor="#eeeeee" class="tableaux">
<tr>
<td width="40">Coeficient en eau du sol</td>
<td width="144"><input name="cof_eau_du_sol" type="text" id="cof_eau_du_sol"></td>
</tr>
<tr>
<td>Niveau de debordement<br></td>
<td><input name="niv_de_debordement" type="text" id="niv_de_debordement"></td>
</tr>
<tr>
<td>Taux concentration precipitation</td>
<td><input name="taux_concentration" type="text" id="taux_concentration"></td>
</tr>
<tr>
<td>Pourcentage d'etanchite</td>
<td><input name="pour_etanchite" type="text" id="pour_etanchite"></td>
</tr>
<tr>
<td>Niveau de départ</td>
<td><input name="niv_depart" type="text" id="niv_depart"></td>
</tr>
<tr>
<td> Sal sol</td>
<td><input name="sal_sol" type="text" id="sal_sol"></td>
</tr>
<td>Origine irigation</td>
<td><select name="origine_iragation" id="origine_iragation">
<option value="choix">Choisir..</option>
<option value="Fleuve">Fleuve</option>
<option value="Canal de navigation">Canal de navigation</option>
</select></td>
</tr>
<td>Sal eau entré</td>
<td>
<select name="sal_eau_entre" id="sal_eau_entre">
<option value="choix">Choisir..</option>
<option value="nul">Nul</option>
<option value="failbe">Faible</option>
<option value="moyen">Moyen</option>
<option value="fort">Fort</option>
</select>
</td>
</tr>
<td>Condition climatique</td>
<td>
<select name="condition_climatique" id="condition_climatique">
<option value="choix">Choisir..</option>
<option value="moyenne">Moyenne</option>
<option value="seche">Seche</option>
<option value="humide">Humide</option>
<option value="hasard">Hasard</option>
</select>
</td>
</tr>
<tr>
<td height="50" colspan="2"><div align="center">
<input type="submit" name="envoi" value="Envoyer" onClick="verifValeur(this.form)" >
<script type='text/javascript' src='val.js' language="JavaScript"></script>
</div></td>
</tr>
</table>
</form>

5 réponses

Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
27 févr. 2013 à 13:57
avec ton precedent post il n'y avait pas le bouton répondre Bizzare !

attention tu as beaucoup d'erreurs de frappe (inversion de lettres)
<script type="text/javascript">
function verifValeur(formulaire) {
	//var formulaire = document.getElementById("monForm");
	//tu passes le nom du formulaire en argument a quoi ça sert de l'atteindre par getElementByid ,
	
	//ensuite puisque que tu as des id dans tes balise <input utilises la fonction getElementById pour lire leur valeur 
	if (document.getElementById('cof_eau_du_sol').value == "")
	{
		alert ("Veuillez saisir le cof");
		document.getElementById('cof_eau_du_sol').focus(); //on met le curseur dans le champ
		return false;
	}

	if(document.getElementById('niv_de_debordement').value == ""){
		alert ("Veuillez saisir le niveau de debordement");
		document.getElementById('niv_de_debordement').focus();
		return false;
	}

	if(document.getElementById('taux_concentration').value == "") {
		alert ("Veuillez saisir le taux de concentration");
		document.getElementById('taux_concentration').focus()
		return false;
	}

	if (document.getElementById('pour_etanchite').value == ""){
		alert ("Veuillez saisir le porcentage d'etancheite d'eau");
		document.getElementById('pour_etanchite').focus();
		return false;
	}
	//tu fais pareil pour les deux autres
	if (formulaire.niv_depart.value == ""){
		alert ("Veuillez saisir le niveau de deaprt");
		return false;
	}

	if(formulaire.sal_sol.value == ""){
		alert ("Veuillez saisir la salinité de sol ");
		return false;
	}
	///
	//pour les listes
	if(document.getElementById("origine_iragation").value == "choix") {
		alert("Veuillez choisir dasn la liste l'origine d'iragation!");
		return false;
	}
	//idem pour l'autre liste
}
</script>

et voilà mon code de formulaire Html:
<!-- ci dessous c'est une valeur que tu passes à la fct donc entre '  ' -->
<form action="valeur.php" method="post" name="formulaire" id="monForm" onSubmit="return verifValeur('formulaire')" >
<table width="350" border="0" align="center" cellpadding="5" cellspacing="0" bgcolor="#eeeeee" class="tableaux">
<tr>
<td width="40">Coeficient en eau du sol</td>
<td width="144"><input name="cof_eau_du_sol" id="cof_eau_du_sol" type="text"></td>
</tr>
<tr>
<td>Niveau de debordement<br></td>
<td><input name="niv_de_debordement" type="text" id="niv_de_debordement"></td>
</tr>
<tr>
<td>Taux concentration precipitation</td>
<td><input name="taux_concentration" type="text" id="taux_concentration"></td>
</tr>
<tr>
<td>Pourcentage d'etanchite</td>
<td><input name="pour_etanchite" type="text" id="pour_etanchite"></td>
</tr>
<tr>
<td>Niveau de départ</td>
<td><input name="niv_depart" type="text" id="niv_depart"></td>
</tr>
<tr>
<td> Sal sol</td>
<td><input name="sal_sol" type="text" id="sal_sol"></td>
</tr>
<td>Origine irigation</td>
<td><select name="origine_iragation" id="origine_iragation">
<option value="choix">Choisir..</option>
<option value="Fleuve">Fleuve</option>
<option value="Canal de navigation">Canal de navigation</option>
</select></td>
</tr>
<td>Sal eau entré</td>
<td>
<select name="sal_eau_entre" id="sal_eau_entre">
<option value="choix">Choisir..</option>
<option value="nul">Nul</option>
<option value="failbe">Faible</option>
<option value="moyen">Moyen</option>
<option value="fort">Fort</option>
</select>
</td>
</tr>
<td>Condition climatique</td>
<td>
<select name="condition_climatique" id="condition_climatique">
<option value="choix">Choisir..</option>
<option value="moyenne">Moyenne</option>
<option value="seche">Seche</option>
<option value="humide">Humide</option>
<option value="hasard">Hasard</option>
</select>
</td>
</tr>
<tr>
<td height="50" colspan="2"><div align="center">
<!-- ci dessous pas besoin de mettre onClick=... puisque tu as onsubmit= dans la balise <form -->
<input type="submit" name="envoi" value="Envoyer"  />
<script type='text/javascript' src='val.js' language="JavaScript"></script>
</div></td>
</tr>
</table>
</form>
0
merci pour ta réponse :)
0
comment je peux afficher un message si tous les champs sont vides ????
0
Alain_42 Messages postés 5361 Date d'inscription dimanche 3 février 2008 Statut Membre Dernière intervention 13 février 2017 894
27 févr. 2013 à 14:14
la verif des champs par la fct js se fait les uns après les autres, donc si tous les champs sont vides ça va d'abord alerter sur le premier, puius après remplisasge sur le 2 ième etc...
0

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

Posez votre question
d'accord merci beaucoup pour ton explication et ta réponse
0