Discussion :

[HWICE]

Bonjour

Ca fait 3 jours que je cherche et que je change mon code pour faire une chose très simple qui est, un div visible ou non

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<div align="center">
              <select name="occ">
                <option onClick="document.getElementById('occautre').style.display=none;"value="">Choisir</option>
                <option value="Occupation simple"  onClick="document.getElementById('occautre').style.display=none;">Occupation simple</option>
                <option value="Occupation double" onClick="document.getElementById('occautre').style.display=none;">Occupation double</option>
                <option value="Occupation double avec enfant" onClick="document.getElementById('occautre').style.display=none;">Occupation double avec enfant</option>
                <option value="Autre" onClick="document.getElementById('occautre').style.display='';">Autre</option>
              </select>
              <div id="occautre" style="display:none" >Précisez
                <input type="text" name="occo" id="occo">
              </div>

Comme vous pouvez remarquer que mon code est très simple...

Le problème est que sur FF tout fonctionne mais sur IE6, IE7 et Safari(windows version) le div ne bouge pas

avez vous une idée, sauf la corde bien sur!!!

[Sub0]

Salut!


Voici toutes les valeurs que peut prendre cette propriété :
http://msdn.microsoft.com/en-us/library/ms530751.aspx

[Bovino]

Code :

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

document.getElementById('un_id').style.display='none'

Tu as oublié les '

[Sub0]

Bonjour Bovino !

Pendant que j'y pense, j'ai un conseil pour HWICE :

Si tu ne connais pas encore, il existe un outil très pratique pour la mise au point du code JavaScript, c'est la console d'erreurs de FireFox. Elle se trouve dans le menu Outils du navigateur...

Un autre conseil : Utilise un éditeur avec coloration syntaxique si ce n'est pas déjà le cas.

A+

[Auteur]

IE (et visiblement Safari) ne prend pas en charge l'événement onclick sur les balises <option>. Gère l'événement onchange sur la balise <select>

[HWICE]

J'utilise deja Firebug et mon code est fait dans dreamweaver CS3

Code :

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

1
2
3
 
 <option value="Occupation double avec enfant" onClick="document.getElementById('occautre').style.display='none';" onchange="document.getElementById('occautre').style.display='none';">Occupation double avec enfant</option>
<option value="Autre" onClick="document.getElementById('occautre').style.display='';" onchange="document.getElementById('occautre').style.display='';">Autre</option>

Ne fonctionne tjs pas. Je veux juste faire apparaitre un champ texte quand l'utilisateur selectionne Autre

[Auteur]

je me répète :

IE (et visiblement Safari) ne prend pas en charge l'événement onclick sur les balises <option>. Gère l'événement onchange sur la balise <select>

[Sub0]

Bovino & Auteur ont raison.

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
<script type="text/javascript">
  function test_value(val){
    var el=document.getElementById('occautre');
    if(val=='Autre') el.style.display='block';else el.style.display='none';
  }
</script>
 
<div align="center">
  <select name="occ" onchange="test_value(this.value);">
    <option value="">Choisir</option>
    <option value="Occupation simple">Occupation simple</option>
    <option value="Occupation double">Occupation double</option>
    <option value="Occupation double avec enfant">Occupation double avec enfant</option>
    <option value="Autre">Autre</option>
  </select>
  <div id="occautre" style="display:none;">Précisez
    <input type="text" name="occo" id="occo"/>
  </div>
</div>

[Sub0]

J'ai oublié une chose...
Si Javascript est désactivé, le champs de saisie n'apparaîtra jamais.
Je te conseille plutôt d'utiliser ce code :

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
<div align="center">
  <select name="occ" onchange="test_value(this.value);">
    <option value="">Choisir</option>
    <option value="Occupation simple">Occupation simple</option>
    <option value="Occupation double">Occupation double</option>
    <option value="Occupation double avec enfant">Occupation double avec enfant</option>
    <option value="Autre">Autre</option>
  </select>
  <div id="occautre">Précisez
    <input type="text" name="occo" id="occo"/>
  </div>
</div>
<script type="text/javascript">
  var el=document.getElementById('occautre');
  function test_value(val){
    if(val=='Autre') el.style.display='block';else el.style.display='none';
  }
  el.style.display='none';
</script>

Côté serveur, tu récupères l'option sélectionnée et si il s'agit de "Autre", tu prends en compte la saisie de l'utilisateur.

[HWICE]

Génial merci bcp Sub0