controler si un bouton d'option a ete coché

Version imprimable

Bonjour,

j'ai un formulaire html sur lequel je fais un controle avec javascript. mon formulaire comprend un
groupe de bouton d'option et je veux m'assurer qu'au moins un a ete cauche avant l'envoi du for
mulaire.

voici un bout de code du formulaire :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<form name="expedition" ... >
.
.
 
<table width="732" cellspacing="0" cellpadding="5">
<tr>
<td width="128">Type de payment</td>
</tr>
<tr>
<td width="128"><label> En compte </label><input type="radio" name="type_pay" value="en compte"></td>
<td width="138"><label> A destination </label><input type="radio" name="type_pay" value=" à destination"></td>
<td width="120"><label> Service </label><input type="radio" name="type_pay" value="service"></td>
<td width="126"><label> Comptant </label><input type="radio" name="type_pay" value="comptant"></td>
<td width="168"><label> Montant total : </label><input type="text" name="montant" maxlength="7"/></td>
</tr>
</table>
.
.
<input type="button" onClick="controle()" name="bouton2" value="enregistrer"/>
</form>

voici le la fonction javascript ' controle() '

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
<script language="javascript">
 
function controle()
{
var a=document.expedition.nombord.value;
var b=document.expedition.nomexp.value;
var c=document.expedition.nomdes.value;
var d=document.expedition.type_pay.value;
 
if (a=="")
{
alert(" Entrez un numero de bordereau! ");
document.expedition.nombord.focus();
}
 
else
if (b=="")
{
alert(" Saisissez le nom de l'expediteur! ");
document.expedition.nombord.focus();
}
 
else
if (c=="")
{
alert(" Saisissez le nom du destinataire! ");
document.expedition.nomdes.focus();
}
 
else
if (d=="")
{
alert(" Choisissez un type de payement! ");
document.expedition.type_pay.focus();
}
 
else
document.expedition.submit();
}
 
</script>

probleme : le formulaire est toujours validé meme si aucune case d'option n'est coché.

ou est le probleme svp ???

16/09/2009, 13h59
SpaceFrog

sujet maintes fois traité et resolu ... merci de faire une recherche sur le forum ...

A noter que pour js le value d'un radio est celui dans la balise, pas le value du radio coché d'un même groupe de name ...

Citation:

Envoyé par SpaceFrog

sujet maintes fois traité et resolu ... merci de faire une recherche sur le forum ...

j'ai modifier ma fonction javascritpt coe suit et ça marche

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
43
44
45
46
<script language="javascript">
 
 function controle()
 {
   var a=document.expedition.nombord.value;
   var b=document.expedition.nomexp.value;
   var c=document.expedition.nomdes.value;
 
   var d=document.getElementsByName('type_pay');
   var coche=0;
   	    for (var i=0; i<d.length; i++)
		 {
          if(!d[i].checked){coche++}
         }
 
 
     if (a=="")
	    {
          alert(" Entrez un numero de bordereau! "); 
		  document.expedition.nombord.focus();		
		} 
 
	 else 
	   if  (b=="")
	    {
          alert(" Saisissez le nom de l'expediteur! "); 
		  document.expedition.nombord.focus();		
        }
 
	 else 
	   if  (c=="")
	    {
          alert(" Saisissez le nom du destinataire! "); 
		  document.expedition.nomdes.focus();		
        }
     else 
	   if  (coche==4)
	    {
          alert(" Choisissez un type de payement! "); 
		  document.expedition.type_pay.focus();		
        }
	 else    
		  document.expedition.submit();	
 }
 
</script>

merci encore !!!

Citation:

Envoyé par SpaceFrog

A noter que pour js le value d'un radio est celui dans la balise, pas le value du radio coché d'un même groupe de name ...

voila mon premier resolu , je reviens avec mon second :mouarf:
maintenant je veut afficher un <input type="text"/> dans le cas ou le dernier des 4 boutons radio( correspondant a 'comptant') est coché. j'ai ecris pour cela une petite fonction javascript :
Code:

1 2 3 4 5 6 7 8 9 10 11 <script type="text/javascript"> function act_desact() { if ( document.getElementsByName('type_pay')[3].checked ) document.formulaire.montant.disabled=true; else document.formulaire.montant.disabled=false; } </script>
sauf que je ne sais pas trs bien ou la placer( dans la balise form, le bouton radio,,,, ) et a quel evenement l'associer(onclick,,,,) ????
je rappelle mon code html du formulaire :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <form...> .. . <table width="732" cellspacing="0" cellpadding="5" onKeyPress="act_desact()"> <tr> <td width="128">Type de payment</td> </tr> <tr> <td width="128"><label> En compte </label><input type="radio" name="type_pay" value="en compte" ></td> <td width="138"><label> A destination </label><input type="radio" name="type_pay" value=" à destination"></td> <td width="120"><label> Service </label><input type="radio" name="type_pay" value="service"></td> <td width="126"><label> Comptant </label><input type="radio" name="type_pay" value="comptant"></td> <td width="168"><label> Montant total : </label><input type="text" name="montant" maxlength="7"/></td> </tr> </table> . . </form>
help me please !!!:oops:

17/09/2009, 09h25
SpaceFrog

sur le onmouseup pour un effet immédiat ?

Citation:

Envoyé par SpaceFrog

sur le onmouseup pour un effet immédiat ?

ok ,, voila ce que j'ai fais et ça ne marche pas !!!!

Code:

1
2
3
4
5
6
7
8
9
10
11
12
<table width="732"  cellspacing="0" cellpadding="5">
  <tr>
   <td width="128">Type de payment</td>
  </tr>
  <tr>
	<td width="128"><label> En compte </label><input type="radio" name="type_pay" value="en compte" ></td>
	<td width="138"><label> A destination </label><input type="radio" name="type_pay" value=" à destination"></td>
	<td width="120"><label> Service </label><input type="radio" name="type_pay" value="service"></td>
	<td width="126"><label> Comptant </label><input type="radio" name="type_pay" value="comptant"></td>
	<td width="168"><label> Montant total : </label><input type="text" name="montant" onMouseUp="act_desact()" maxlength="7"/></td>
    </tr>
</table>

:oops: :oops:

17/09/2009, 09h56
SpaceFrog

Ben non! Ttu veux verifier les boutons radios lorsque ceux ci sont cliqués, donc le mouseup sur tous les boutons radios qui lancent une fonction qui teste le nombre de radios cochés et afficeh ou non l'input text

Citation:

Envoyé par SpaceFrog

Ben non! Ttu veux verifier les boutons radios lorsque ceux ci sont cliqués, donc le mouseup sur tous les boutons radios qui lancent une fonction qui teste le nombre de radios cochés et afficeh ou non l'input text

ok , d'abord je reprecise : j'ai 4 options radio ,, et je veux si on choisit la qutrieme option ,,, un champ texte s'affiche.

donc voila j'ai suivi ta derniere recommandation et ça ne donne tjrs pas
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 .. . . <table width="732" cellspacing="0" cellpadding="5"> <tr> <td width="128">Type de payment</td> </tr> <tr> <td width="128"><label> En compte </label><input type="radio" name="type_pay" value="en compte" onMouseUp="act_desact()"></td> <td width="138"><label> A destination </label><input type="radio" name="type_pay" value=" à destination" onMouseUp="act_desact()"></td> <td width="120"><label> Service </label><input type="radio" name="type_pay" value="service" onMouseUp="act_desact()"></td> <td width="126"><label> Comptant </label><input type="radio" name="type_pay" value="comptant" onMouseUp="act_desact()"></td> <td width="168"><label> Montant total : </label><input type="text" name="montant" maxlength="7"></td> </tr> </table> . . .
t aurais pas une autre solution ????

en fouillant sur internet , j'ai pu finalement pu modifier mon script comme suit
fonction javascript:

Code:

1
2
3
4
5
6
7
8
9
<script type="text/javascript">
function act_desact()
{
if ( document.getElementById('type_cpt').checked )
document.forms['expedition'].elements['montant'].disabled=false;
else
document.expedition.montant.disabled=true;
}
</script>

xhtml :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
.
.
.
<table width="732" cellspacing="0" cellpadding="5">
<tr>
<td width="128">Type de payment</td>
</tr>
<tr>
<td width="128"><label> En compte </label><input type="radio" name="type_pay" value="en compte" onmouseup="setTimeout(function(){act_desact()},10)" ></td>
<td width="138"><label> A destination </label><input type="radio" name="type_pay" value=" à destination" onmouseup="setTimeout(function(){act_desact()},10)" ></td>
<td width="120"><label> Service </label><input type="radio" name="type_pay" value="service" onmouseup="setTimeout(function(){act_desact()},10)" ></td>
<td width="126"><label> Comptant </label><input type="radio" name="type_pay" id="type_cpt" value="comptant" onmouseup="setTimeout(function(){act_desact()},10)"></td>
<td width="168"><label> Montant total : </label><input type="text" name="montant" disabled="disabled"> </td>
</tr>
</table>
.
.
.

et ça marche parfaitement. vive javascript ....
et merci encore pour les Post, a bientot.