Tester les champs vides

MiWi86-33 Messages postés 149 Statut Membre -  
MiWi86-33 Messages postés 149 Statut Membre -
Bonjour bonjour!!!!!

j'ai un formulaire, et j'aimerais pouvoir tester les champs vides avant d'envoyer mon formulaire.

Mais voilà, 2 problèmes se posent :

-le premier : je n'arrive pas à faire le contrôle correctement sur mes boutons radios, le contrôle n'est positif que lorsque je valide le premier choix!
-le deuxième : même si il y a des champs vide, mon formulaire est quand même envoyé à ma page action ="reg.php".

Ce que je souhaite, c'est donc de régler mon soucis avec les boutons radios, mais aussi de ne pas envoyer mon formulaire, s'il y a des champs vide.

je vous montre mon code :

Code :
<script type="text/Javascript">
	
	function couleur(obj) 
	{
		obj.style.backgroundColor = "#FFFFFF";
	}
	
	function check() 
	{
		var msg = "";

		if (document.getElementById('adrMan').value != "")	
		{
			var expr = /^(((22[4-9]|23[0-9])\.)((25[0-4]|2[0-4][0-9]|[1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[0-9])\.)((25[0-4]|2[0-4][0-9]|[1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[1-9])\.)((25[0-4]|2[0-4][0-9]|[1]{1}[0-9]{2}|[1-9]{1}[0-9]{1}|[0-9]))$)/;
			if(!expr.exec(document.getElementById('adrMan').value))
			{
				document.getElementById('adrMan').style.backgroundColor = "#F3C200";
				msg += "adresse non valide : sélectionnez une adresse entre 224.0.1.0 et 239.254.254.254";
			}
		}
		else	
		{
			document.getElementById('adrMan').style.backgroundColor = "#F3C200";
			msg += "Veuillez saisir une adresse IP.\n";
		}
		
		if (document.getElementById('adrAuto').value != "")
		{
			if(document.getElementById('selectAuto').checked == "")
			{
				msg += "Veuillez choisir entre permanent et temporaire \n";
				document.getElementById('selectAuto').style.backgroundColor = "#F3C200";
			}
		}
		
		
		
		if (document.getElementById('port').value == "")	
		{
			msg += "Veuillez saisir un numéro de port \n";
			document.getElementById('port').style.backgroundColor = "#F3C200";
		}
		
		if (document.getElementById('chaine').value == "")	
		{
			msg += "Veuillez saisir un nom de chaine\n";
			document.getElementById('chaine').style.backgroundColor = "#F3C200";
		}

		if (document.getElementById('type').checked == "")	
		{
			msg += "Veuillez choisir un type (MPTS ou SPTS)\n";
			document.getElementById('type')[i].style.backgroundColor = "#F3C200";
		}
		
		if (document.getElementById('codage').checked == "")	
		{
			msg += "Veuillez choisir un codage (MPG4 ou MPEG2)\n";
			document.getElementById('codage').style.backgroundColor = "#F3C200";
		}
		
		if (document.getElementById('def').checked == "")	
		{
			msg += "Veuillez choisir une définition (HD ou SD)\n";
			document.getElementById('def').style.backgroundColor = "#F3C200";
		}
		
		if (document.getElementById('syst').checked == "")	
		{
			msg += "Veuillez choisir un systeme (PAL ou NTSC)\n";
			document.getElementById('syst').style.backgroundColor = "#F3C200";
		}
				
		if (msg == "") 
			return(true);
		else	
		{
			alert(msg);
			return(false);
		}
	}
	</script>
<body>
<form id="formInsert" name="formInsert" method="post" action="reg.php"onSubmit="return check();" >
<input type="hidden" name="envoie" value="1" />
	<div id="formListDeroul">
		<label>
		<select name="listDerou" size="1" id="select" >
			<option value="select" onclick="selectionner()">------Selectionner------</option>
			<option value="auto" id="auto" onclick="auto()" >Auto</option>
			<option value="manuel" onclick="manuel()">Manuel</option>
		</select>
		</label>
	</div>
 <br />
	<div id="formSelectAuto" style="display:none">
		Permanent <input type="radio" id="selectAuto" name="selectAuto" value="permanent" class="OPTION" onKeyUp="javascript:couleur(this);" />
	<br>
		Temporaire <input type="radio" id="selectAuto" name="selectAuto" value="temporaire" class="OPTION"onKeyUp="javascript:couleur(this);" />
		<input name="adrauto" type="text" id="adrAuto" value="<?php
										include("connect.php");
										$ip = "224.0.1.0";
										if(Connecter())
										{
											$MonSQL= "SELECT * FROM information ORDER BY Multicast";
											$CurseurMulticast = mysql_query($MonSQL);
											$UnMulticast = GetLigne($CurseurMulticast);
											while($UnMulticast)
											{
												$suivante = long2ip(ip2long($ip)+1);
												if($UnMulticast["Multicast"]==$ip)
												{
													$ip=$suivante;
												}
												$UnMulticast = GetLigne($CurseurMulticast);
											}
											echo $ip;
											//return $ip;
										}?>" size="30" onKeyUp="javascript:couleur(this);" />
	<br />
 </div>
 
	<div id="formSelectMan" style="display:none">
		<input name="adrman" type="text" id="adrMan" value="Entrez l'adresse" size="15" onKeyUp="javascript:couleur(this);"/>
 <input name="vue" type="button" value="Vérifier" onclick="verif()" />
	</div>
	<br />
	<label> Port <input name="port" type="text" id="port" value="" size="8" onKeyUp="javascript:couleur(this);"/> </label>
<p>
	<LABEL>Type : </LABEL>
		MPTS <input type="radio" id="type" name="type" value="mpts" class="OPTION" onClick="javascript:MPTS()" onKeyUp="javascript:couleur(this);"/>
		SPTS <input type="radio" id="type" name="type" value="spts" class="OPTION" onClick="javascript:SPTS()" onKeyUp="javascript:couleur(this);">

	<div id="formulaireReference">
		<br><label> Chaine <input type="text" id="chaine" name="chaine0" size="20" id="chaine"onKeyUp="javascript:couleur(this);"/> </label>
		<br />
 <LABEL>Codage : </LABEL>
			MPG4 <input type="radio" id="codage" name="codage0" value="mpg4" class="OPTION" onKeyUp="javascript:couleur(this);"/>
			MPEG2 <input type="radio" id="codage" name="codage0" value="mpeg2" class="OPTION"onKeyUp="javascript:couleur(this);" >
		<br />
 <LABEL>Définition : </LABEL>
			SD <input type="radio" id="def" name="def0" value="SD" class="OPTION" onKeyUp="javascript:couleur(this);"/>
			HD <input type="radio" id="def" name="def0" value="HD" class="OPTION" onKeyUp="javascript:couleur(this);">
		<br />
 <LABEL>Systeme : </LABEL>
			PAL <input type="radio" id="syst" name="syst0" value="PAL" class="OPTION" onKeyUp="javascript:couleur(this);"/>
			NTSC <input type="radio" id="syst" name="syst0" value="NTSC" class="OPTION"onKeyUp="javascript:couleur(this);" >
		<br> 
 
</div>
	<div id="formulaires"></div>
<p>
	<input type="button" id="ajt0" name="ajout0" value="ajouter" style="display:none" onclick="javascript:add()" >

</form>
<p>
<input type="submit" id="Soumettre" name="Soumettre" value="Soumettre" />


et comment ajouter les couleurs au bouton radio vide? comme pour chaine ou port avec la fonction couleur(obj)...

Merci d'avance pour vos futurs réponses!!!
A voir également:

7 réponses

MiWi86-33 Messages postés 149 Statut Membre 9
 
Si tous mes champs ont le même id, alors pourquoi le controle de saisi, de champs vide, ne s'effectue t-il pas sur les nouveaux formulaires??????,
1
Utilisateur anonyme
 
Salut !

A faire dans l'ordre :

- Supprimer le onSubmit du body
- Changer le bouton "Soumettre" de type submit en type button
- Ajouter l'attribut onClick="check()" sur le bouton "Soumettre"
- Supprimer le [i] dans la fonction javascript lorsque tu testes "Type"
- Tu modifies la fin de ta fonction jacvascript comme suit :
if (msg == "")
    document.form.submit();
else	
    alert(msg);
Normalement ça devrait marcher ;-)
-1
MiWi86-33 Messages postés 149 Statut Membre 9
 
HEY HEY?

Merci pour ta réponse, c'est exactement ce que je voulais, ceci dit le soucis du bouton radio se pose toujours, le formulaire n'est valide que lorsque je selectionne le premier choix!!!!

j'avais trouvé un truc comme quoi il fallait mettre un indice, mais je n'ai pas réussi à "comprendre son fonctionnement" d'où l'essai avec le [i]...

et comment mettre la couleur sur les boutons radios lorsqu'ils sont vides?
-1
Utilisateur anonyme
 
Voilà le test à faire pour tes radios boutons : (Exemple pour le type)
if (!document.formInsert.elements['type'][0].checked && !document.formInsert.elements['type'][1].checked)
Je regarde pour la couleur ;-)
-1

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

Posez votre question
MiWi86-33 Messages postés 149 Statut Membre 9
 
merci merci!!!!!!!!!!!!
j'arrive bien à selectionner un choix ou un autre!!!!

mais j'ai pas tout dis.....

Comme tu as pu le voir, j'ai :

<input type="button" id="ajt0" name="ajout0" value="ajouter" style="display:none" onclick="javascript:add()" >


et ma fonction add() correspond à :

var numForm = 1;
	var contentDivName = "formulaires";
    
	function add()
	{
		 
		/* Retrieve fieldSet from the page */
         var conteneur   = document.getElementById(contentDivName);
        /* Create elements that we need into the new form to add  */
         var undiv      = document.createElement('div');
		 
		 var nbNumForm = document.createElement('input');
		 var leNumForm = document.createElement('input');
		 
		 var MaChaine = document.createTextNode("Chaine : ");
		 var chaine        = document.createElement('input');
		 
		
		 var MonCodage = document.createTextNode("Codage : ");
		 var MonMpg4 = document.createTextNode("MPG4 ");
		 var mpg4        = document.createElement('input');
		 var MonMpeg2 = document.createTextNode("MPEG2 ");
		 var mpeg2 = document.createElement('input');
	         
                 ...
	 
                var but = document.createElement('input');
		 
		 nbNumForm.type = 'hidden';
		 nbNumForm.name = 'dernierNumForm';
		 nbNumForm.value = numForm;
		 
		 leNumForm.type = 'hidden';
		 leNumForm.name = numForm;
		 
                chaine.type   = 'text';
		 chaine.name   = 'chaine'+numForm;
		 chaine.id = 'chaine';
		 
		 mpg4.type   = 'radio';
		 mpg4.name = 'codage'+numForm;
		 mpg4.value = 'mpg4';
		 mpg4.id = 'codage';
		 
		 mpeg2.type   = 'radio';
		 mpeg2.name = 'codage'+numForm;
		 mpeg2.value = 'mpeg2';
		 mpeg2.id = 'codage';
		 
		 ...
         
		 but.type   = 'button';
         but.value  = 'Supprimer le formulaire';

        // Implement delete function on the button
         but.onclick = function()
		 {
        	// Element to remove
        	 lediv      = this.parentNode;
        	// Element parent
        	 lefieldset   = lediv.parentNode;
        	// Remove the element
        	 lefieldset.removeChild(lediv);
         }

        /* Append elements (new form) into the page */
		 undiv.appendChild( document.createElement('br') );
		 
		 undiv.appendChild(nbNumForm);
		 undiv.appendChild(leNumForm);	 
		
		 undiv.appendChild(MaChaine);
		 undiv.appendChild(chaine);
		 
		 undiv.appendChild( document.createElement('br') );
		 
		 undiv.appendChild(MonCodage);
		 undiv.appendChild(MonMpg4);
		 undiv.appendChild(mpg4);
		 undiv.appendChild(MonMpeg2);
		 undiv.appendChild(mpeg2);
		 
		 undiv.appendChild( document.createElement('br') );
		 
		 ...
		 
		 undiv.appendChild(but);
		 
		  
         conteneur.appendChild(undiv);
		 
		 numForm++;
		 
	}


Soit à la création ou suppression d'un ou plusieurs autre formulaires, je pensais qu'en donnant le même id ça marcherait quand même, mais il se trouve que check() n'agit pas sur les nouveaux formulaires.

Comment ça se fait et comment faire?
-1
Utilisateur anonyme
 
Justement si ils ont le même id comment veux tu que javascript reconnaisse quel champs il doit tester ???

A mon avis lorsque tu ajoutes tes nouveaux éléments tu devrais leur attacher une fonction javascript de contrôle pour t'assurer qu'ils ne sont pas vides.
-1
MiWi86-33 Messages postés 149 Statut Membre 9
 
il faudrait que je reboucle???
-1