Faire disparaitre et apparaitre un div simultanement ?

**Nooky** · 16/02/2010, 14h41

Bonjour à tous,

Je suis aujourd'hui sur ce forum car j'ai un petit souci et j'ai eu beau creuser à droite à gauche sur le net, je ne trouve pas de solution à mon problème (ou alors, des solutions s'en rapprochant mais que je n'arrive pas à mettre en oeuvre

).

Tout d'abord, je dois préciser que je suis un néophyte total en javascript. J'ai un poil plus de connaissances en php et encore, connaissances est un grand mot...

Voici mon problème :

J'ai un formulaire. Dans ce formulaire, un input Select. En dessous du Select, un TextArea.

En fonction du choix de l'utilisateur sur le select, j'aimerais faire disparaitre le TextArea pour en faire apparaitre un autre (en réalité, 3 autres pour les champs d'une date).

Hors, si avec une solution OnChange et fonction qui va bien, j'arrive à faire disparaitre le TexteArea, impossible en revanche de faire apparaitre un autre div derrière.

Voici mon code (celui qui ne 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
<html>
<head>
<title>Title here!</title>
 
<script language='javascript'>
function ChangeTextArea(texte)
{
if (texte=="autre")
document.getElementById("Champ1").style.display= 'none';
document.getElementById("Champ2").style.display= 'block';
else
document.getElementById("Champ1").style.display= 'block';
document.getElementById("Champ2").style.display= 'none';
}
</script>
 
</head>
<body>
<FORM ACTION="index.php" name="formulaire">
 
<SELECT size=1 onchange="ChangeTextArea(this.value)" name=option >
<OPTION value="un">Un</OPTION>
<OPTION value="deux">Deux</OPTION>
<OPTION value="trois">Trois</OPTION>
<OPTION value="autre">Autre</OPTION>
</SELECT>
 
<div id="Champ1" style="display:block">
<input type="text" name="Event">
</div>
 
<div id="Champ2" style="display:none">
<input type="text" name="Date1">
<input type="text" name="Date2">
<input type="text" name="Date3">
</div>
 
<input type="submit">
</form>
</body>
</html>

Auriez-vous une idée d'où vient le problème ? J'avoue qu'après par mal de temps à triturer ce code dans tous les sens, je sèche.

Merci d'avance !
Nooky

**gwyohm** · 16/02/2010, 14h59

Bonjour et bienvenue sur le forum.

Tu es face à un probleme de syntaxe :
il faut mettre des accolades pour délimiter tes blocs if et else :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
function ChangeTextArea(texte)
{
  if (texte=="autre") 
  {
  document.getElementById("Champ1").style.display= 'none';
  document.getElementById("Champ2").style.display= 'block';
  }
  else
  {
  document.getElementById("Champ1").style.display= 'block';
  document.getElementById("Champ2").style.display= 'none';
  }
}

**Nooky** · 16/02/2010, 15h33

La HONTE

J'avais testé avec des accolades mais manifestement, j'avais oublié de clore le if. Et comme à l'exécution, il n'affiche pas de "syntaxe error" (habitude du php), je n'ai pas pensé à ça.

Merci infiniment gwyohm

Nooky

Faire disparaitre et apparaitre un div simultanement ?

JavaScript

Discussions similaires

Partager

Partager