[DOM] Afficher et cacher une liste déroulante

**yaboki** · 28/01/2009, 12h54

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 :

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
<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>

**SpaceFrog** · 28/01/2009, 13h08

une synatxe plus rigousreuse peut etre ?

Code :

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

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

**jln13** · 28/01/2009, 13h17

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

**E.Bzz** · 28/01/2009, 14h04

Bonjour,

Envoyé par SpaceFrog

une synatxe plus rigousreuse peut etre ?

Oui, et une structure de document itou

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

Code :

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

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

A+

**yaboki** · 28/01/2009, 14h53

voila le code que ça génère

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
<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>

**E.Bzz** · 28/01/2009, 14h59

Ah tiens : plus de formulaire

Possible que ça soit une piste, non ?

A+

**SpaceFrog** · 28/01/2009, 15h14

heu un script dans un td ...

**yaboki** · 28/01/2009, 17h23

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

Code :

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

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 :

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
<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>

**E.Bzz** · 28/01/2009, 17h29

Envoyé par yaboki

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

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)

A+

**yaboki** · 28/01/2009, 18h45

c bien ce que je fait
j'exécute mon code et après je copie ce qu'il a généré.
voilà

**SpaceFrog** · 29/01/2009, 08h45

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 ...

**yaboki** · 29/01/2009, 14h59

alors là meme en enlevant les <table> les <td> et tout
ça donne rien

je ne comprend pas

**SpaceFrog** · 29/01/2009, 15h25

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 ...

**yaboki** · 30/01/2009, 12h18

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 :

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
<? 
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 :

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
 
<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

**Bovino** · 30/01/2009, 12h53

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

EDIT :

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 !!!

**yaboki** · 02/02/2009, 18h40

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 :

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
 
<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>

**E.Bzz** · 02/02/2009, 18h44

Envoyé par SpaceFrog

une synatxe plus rigousreuse peut etre ?

Code :

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

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

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

[DOM] Afficher et cacher une liste déroulante

JavaScript

Discussions similaires

Partager

Partager