affichier un INPUT lors d'un choix ....

**apt** · 01/01/2005, 13h44

Salut,

j'aimerai bien afficher un champ texte apres que la case option soit cochée.

j'ai fait le code suivant :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<form method="POST" action="$PHP_SELF"> 
  <input type="radio" value="V1" name="R1">Autres 
  <? if ($r1 = checked) 
  echo '<input type="text" name="T1" size="20">'?> 
  <p> 
  <input type="submit" value="Envoyer" name="B1"> 
  <input type="reset" value="Rétablir" name="B2"> 
  </p> 
</form>

mais ca n'a pas fonctionne ...

**dervish** · 01/01/2005, 16h06

Salut et bonne année,
tu peux essayer un truc du genre:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<html>
	<head/>
	<body>
		<form method="POST" action="target.php">
			<input type="radio" value="V1" name="R1" onClick="if(this.checked) document.getElementById('T1').style.display='inline'">Autres</input>
			<input type="text" id="T1" size="20" style="display:none"/><br/>
			<input type="submit" value="Envoyer" name="B1"/><br/>
			<input type="reset" value="Rétablir" name="B2"/><br/>
			</p>
		</form>
	</body>
</html>

**eric.pommereau** · 01/01/2005, 16h20

Salut ... dervish m'a devancé d'un click ...

Une autre possibilité :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<html>
<head>
<title></title>
<script type="text/javascript">
	function showHideEdit(RadioParam)
   {
   	// récuperer le controle input type="radio" passé en argument
   	var oRadioParam = document.getElementById(RadioParam);
      // récuperer le tableau des elements INPUT de la page (ici les radios et les text)
      var oInputs = document.getElementsByTagName("input");   
 
      // Boucler sur chaque élément INPUT
      for (var i=0;i<oInputs.length;i++)
      {	
      	// Si l'élément INPUT est de type radio
      	if (oInputs[i].type == "radio")
         {
         	// Si l'élément à le même ident que mon INPUT radio passé en argument
         	if (oInputs[i].id == oRadioParam.id) 
            {
            	// Je rends visible mon élément +1 (l'input type text correspondant au radio) 
            	oInputs[i+1].style.visibility = "visible";              
				}               
            else
            { 
            	// Je cache mon élément +1 (l'input type text correspondant)
            	oInputs[i+1].style.visibility = "hidden";              
				}             
			}               
      } // for (var i=0;i<oInputs.length;i++)
   }// function showHideEdit(RadioParam)
</script>
</head>
<body>
   <table border="1">
   	<tr>
      	<td>
         	<input name="radioEdit" type="radio" checked id="radio1" onClick="showHideEdit('radio1')">Radio1</input>        
         </td>
      	<td>
         	<input type="text" id="input1" value="input1"></input>        
         </td>      
      </tr>
   	<tr>
      	<td>
         	<input name="radioEdit" type="radio" id="radio2" onClick="showHideEdit('radio2')">Radio2</input>        
         </td>
      	<td>
         	<input type="text" id="input2" value="input2" style="visibility:hidden;"></input>        
         </td>      
      </tr>
   	<tr>
      	<td>
         	<input name="radioEdit" type="radio" id="radio3" onClick="showHideEdit('radio3')">Radio3</input>        
         </td>
      	<td>
         	<input type="text" id="input3" value="input3" style="visibility:hidden;"></input>        
         </td>      
      </tr>         
   </table>
</body>
</html>