[DOM] Afficher et cacher une liste déroulante

Version imprimable

Bonjour
j'ai besoin de votre aide sur ce code là qui me parait correcte mais il marche pas :)
ce code normalement doit m'afficher la liste déroulante de la question 2 quand je choisi la réponse "oui" dans la première question.

merci de votre d'aide.

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
<script>   
   function ShowUrlField()
   {
   if(document.formulaire.ASCr.value == "Oui" )
   {
 
     document.formulaire.ASC_alt.style.visibility = "visible";
 }
else
  document.formulaire.ASC_alt.style.visibility = "hidden";
 }
</script>
<table border=2 bordercolor=#FE0008>
<tr>
<td><b>Question1?</b></td>
<td>
 
<form name="formulaire">
 
<select name="ASCr" onChange="ShowUrlField()">
<option value ="" <?php if ($change['ASCr']=="") echo "selected"; ?>>Inconnu</option>
<option value ="Oui" <?php if ($change['ASCr']=="Oui") echo "selected"; ?>>Oui</option>
<option value ="Non" <?php if ($change['ASCr']=="Non") echo "selected"; ?>>Non</option>
</select>
 
</td>
</tr>
<tr>
<td><b>Question 2</b></td>
<td>
<select name="ASC_alt" style="visibility:hidden" >
<option value ="" <?php if ($change['ASC_alt']=="") echo "selected"; ?>>Inconnu</option>
<option value ="Oui" <?php if ($change['ASC_alt']=="Oui") echo "selected"; ?>>Oui</option>
<option value ="Non" <?php if ($change['ASC_alt']=="Non") echo "selected"; ?>>Non</option>
</select>
</td>
</tr>
</form>	
</table>

28/01/2009, 13h08
SpaceFrog

une synatxe plus rigousreuse peut etre ?

Code:

document.forms['formulaire'].elements['ASC_alt'].style.visibility = "hidden";
28/01/2009, 13h17
jln13

En testant ton code ca marche sous ie6 et ff3..
Essaye de poster le html généré pour qu'on ait exactement la même version du code que toi.

Sinon "a l'intuition" je dirai que tu as peut être un problème de cache et que tu as garde l'ancienne version de ton code JS. Essaye ctrl - F5 pour être sur d'avoir les dernières modifications de ton code ;)
28/01/2009, 14h04
E.Bzz
Bonjour,

Citation:

Envoyé par SpaceFrog

une synatxe plus rigousreuse peut etre ?

Oui, et une structure de document itou :aie:

=> sort ton <form> de la structure de la table :
Code:

1 2 3 4 5 <form ...> <table> ... </table> </form>
A+

voila le code que ça génère

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
<tr>
<td><b>question1 </b></td>
<td>
<script>   
   function ShowUrlField()
   {
   if(document.forms['formulaire'].elements['ASCr'].value == "Oui" )
   {
	 document.forms['formulaire'].elements['ASC_alt'].style.visibility = "visible";
 }
else
  document.forms['formulaire'].elements['ASC_alt'].style.visibility = "hidden";
 }
</script>
 
 
<select name="ASCr" onchange="ShowUrlField()">
<option value="">Inconnu</option>
<option value="Oui" selected="selected">Oui</option>
<option value="Non">Non</option>
</select>
 
</td>
</tr>
<tr>
<td><b>question2</b></td>
<td>
<select name="ASC_alt" style="visibility: hidden;">
<option value="" selected="selected">Inconnu</option>
<option value="Oui">Oui</option>
<option value="Non">Non</option>
</select>
</td>
</tr>

28/01/2009, 14h59
E.Bzz

Ah tiens : plus de formulaire :?

Possible que ça soit une piste, non ?

A+
28/01/2009, 15h14
SpaceFrog

heu un script dans un td ... :roll:

désolé j'avais oublié <form></form>
en plus de ça j'ai sorti mon scipt du <td>
et ça donne rien :?

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<SCRIPT>
function ShowUrlField()
   {
   if(document.formulaire.ASCr.value == "Oui" )
   {
 
     document.formulaire.ASC_alt.style.visibility = "visible";
 }
else
  document.formulaire.ASC_alt.style.visibility = "hidden";
 
 }
</SCRIPT>

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
<form name="formulaire">
<table border=2 bordercolor=#FE0008>
<tr>
<td><b>question 1</b></td>
<td>
 
 
 
<select name="ASCr" onChange="ShowUrlField()">
<option value ="" >Inconnu</option>
<option value ="Oui" selected>Oui</option>
 
<option value ="Non" >Non</option>
</select>
 
</td>
</tr>
<tr>
<td><b>question 2</b></td>
<td>
<select name="ASC_alt" style="visibility:hidden" >
<option value ="" selected>Inconnu</option>
<option value ="Oui" >Oui</option>
<option value ="Non" >Non</option>
 
</select>
</td>
</tr>
</table>
</form>

28/01/2009, 17h29
E.Bzz

Citation:

Envoyé par yaboki

désolé j'avais oublié <form></form>

:koi:

Ca ne sert à rien de taper ce code à la main : il n'est pas l'image de ce que reçoit ton navigateur.
Fais un copié/collé à partir du code source de la page (une fois affichée dans le nav), c'est la seule manière de le faire correctement ...

Sinon, tu nous fais debugger des erreurs qui n'existent pas (comme cette fois) :roll:

A+
28/01/2009, 18h45
yaboki

c bien ce que je fait
j'exécute mon code et après je copie ce qu'il a généré.
voilà
:)
29/01/2009, 08h45
SpaceFrog

c'est sur que l'utilisation de table pour la mise en page dans un form ça n'aide pas ...
le tableau a tendance à masquer les éléments pour le DOM ...
29/01/2009, 14h59
yaboki

alors là meme en enlevant les <table> les <td> et tout
ça donne rien
8O
je ne comprend pas
29/01/2009, 15h25
SpaceFrog

il est sur que si tu nous montrait l'état de ton code à l'heure qu'il est cela pourrait éventuellement nous permettre de t'aider ... :roll:

je rappelle juste ce que j'attends de ce code;
je veux juste afficher et cacher la liste déroulante de la question 2 selon la valeur de la question 1. mais ça marche pas.

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
<? 
include("config.php");
$db = mysql_connect($serveur, $login, $password); 
mysql_select_db($base,$db);  
$sql = "SELECT * FROM batiment WHERE ID = '$recu_ID'";
$resultat = mysql_query ($sql);
$change = mysql_fetch_array ($resultat);
mysql_close($db);
?>
 
<html>
<SCRIPT>
  function ShowUrlField()
 {
   if(document.formulaire.ASCr.value == "Oui" )
   {
 
     document.formulaire.ASC_alt.style.visibility = "visible";
	}
else
  document.formulaire.ASC_alt.style.visibility = "hidden";
 }
</SCRIPT>
<form name="formulaire">
<b>question 1</b>
 
<select name="ASCr" onChange="ShowUrlField()">
<option value ="" <?php if ($change['ASCr']=="") echo "selected"; ?>>Inconnu</option>
<option value ="Oui" <?php if ($change['ASCr']=="Oui") echo "selected"; ?>>Oui</option>
<option value ="Non" <?php if ($change['ASCr']=="Non") echo "selected"; ?>>Non</option>
</select>
 
 
<b>question 2</b>
 
<select name="ASC_alt" style="visibility:hidden" >
<option value ="" <?php if ($change['ASC_alt']=="") echo "selected"; ?>>Inconnu</option>
<option value ="Oui" <?php if ($change['ASC_alt']=="Oui") echo "selected"; ?>>Oui</option>
<option value ="Non" <?php if ($change['ASC_alt']=="Non") echo "selected"; ?>>Non</option>
</select>
</form>	
</html>

voila l'exemple d'ou je me suis inspiré

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
 
<html>
<script>   
   function ShowUrlField()
   {
   if(document.formulaire.typeDeLien_1.value == "externe" )
   {
     document.formulaire.url_1.style.visibility = "visible";
 }
else
  document.formulaire.url_1.style.visibility = "hidden";
 }
 </script>
 <form name="formulaire">
             Type de lien: <select name="typeDeLien_1" onChange="ShowUrlField()">
                            <option value="normal">normal</option>
                            <option value="externe" >lien vers un autre site</option>
 
                          </select>
            <label> url du lien: <input type="text" style="visibility:visible" name="url_1" /></label>
 
 </form>
 
 </html>

Merci

30/01/2009, 12h53
Bovino

Pas de body ni de head ??? Il manque des choses dans ta page...

EDIT :

Citation:

Envoyé par Les règles incontournables d'utilisation de ce forum

Suite à ce rappel, je voudrais porter à votre attention que ce forum ne doivent contenir que le code affiché par le navigateur. En effet, les codes PHP ou tout autre langage dynamique ne servent qu'à générer le corps de votre page et donc votre problème ne pourra être résolu qu'en étudiant le code interprété par le navigateur. De ce fait, avant de poser votre question merci d'épurer votre code de tout langage serveur.

A LIRE !!!

j'ai réussi à faire marcher mon code mais pas en entier.
Est ce que le fait de mettre deux fonctions javascript permet de l'empêcher le fonctionnement d'une??
comme dans l'exemple qui suit, c'est lorsque que j'enlève la fonction reponse() que mon code marche avec la fonction ShowUrlField()

Vous avez une explication SVP?? 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
41
42
43
44
45
46
47
48
49
50
 
<html>
<head>
<script language="javascript">
function reponse() 
{
if ( (form4.ASCr.value == "Oui") && (form4.ASC_alt.value == ""))
{ alert("Vous devez choisir une réponse ") ;}
 
if ( (form4.TFPB.value == "Oui") && (form4.TFPB_fin.value <> "") )
{ alert("Vous devez choisir une réponse à la question") ;}
else
{
form4.submit();
}
}
 
  function ShowUrlField()
 {
   if(document.formulaire.ASCr.value == "Oui" )
   {document.formulaire.ASC_alt.style.visibility = "visible";}
else
 
 { document.formulaire.ASC_alt.style.visibility = "hidden";}
 }
</SCRIPT>
</head>
 
<body>
<form name="form4" method="POST" action="valider.php"> 
<b>question 1</b>
 
<select name="ASCr" onChange="ShowUrlField()">
<option value ="" >Inconnu</option>
<option value ="Oui" >Oui</option>
<option value ="Non" >Non</option>
</select>
 
 
<b>question 2</b>
 
<select name="ASC_alt" style="visibility:hidden" >
<option value ="" selected>Inconnu</option>
<option value ="Oui" >Oui</option>
<option value ="Non" >Non</option>
</select>
<input type="submit" class="bouton"  onClick="reponse(); return false;" value="Valider">
</form>
</body>
</html>

02/02/2009, 18h44
E.Bzz

Citation:

Envoyé par SpaceFrog

une synatxe plus rigousreuse peut etre ?

Code:

document.forms['formulaire'].elements['ASC_alt'].style.visibility = "hidden";

1° réponse donnée, mais toujours pas prise en compte :roll: