Sujet Précédent Sujet Suivant

Selection une option Afficher/masquer des div !

Résolu
younes371 Messages postés 502 Date d'inscription mercredi 29 décembre 2004 Statut Membre Dernière intervention 20 mars 2012 - 27 août 2007 à 11:45
younes371 Messages postés 502 Date d'inscription mercredi 29 décembre 2004 Statut Membre Dernière intervention 20 mars 2012 - 27 août 2007 à 19:07
Bonjour,
j ai une liste (select) avec deux options, ce que je veux faire :
lorsque je selectionne une option j affiche un div (contient les informations de cette option) et je masque un autre div (qui les informations  du 2eme option).
j ai fait ce script :
<script langage="JavaScript">

function aDuree(thingId,thingId2)

{

var targetElement; var targetElement2;

targetElement = document.getElementById(thingId) ;

targetElement.style.display = "" ;

targetElement2 = document.getElementById(thingId2) ;

targetElement2.style.display = "none" ;

}

</script>

et dans le code html
<select id="duree" name="duree">

<option value="d" onSelect="javascript:aDuree('Div7','Div8');">Saisir dur&eacute;e</option>

<option value="df" onSelect="javascript:aDuree('Div8','Div7');">Saisir D&eacute;but / Fin</option>

</select>

mais ça ne marche pas , pouvez vous m aider, merci.

N'importe où. 
mais là où il le faut.

10 réponses

Réponse 1 / 10
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
27 août 2007 à 12:19
bonjour,

   onselect ? pas permis sur un select, si ?
   pas d'évènements sur option ( enfin, pour IE, avec FF ça baignerait )
         il faut mettre sur la balise select....

<script type="text/JavaScript">
function appel(sel)
{ switch (sel.selectedIndex)
  { case 0:
      aDuree('Div7','Div8');
      break;
   case 1:
      aDuree('Div8','Div7');
      break;  
  }
}

function aDuree(thingId,thingId2)
{ document.getElementById(thingId).style.display = "" ;
  document.getElementById(thingId2).style.display = "none" ;
}




</script>

<select id="duree" name="duree"
   onchange="appel(this);">





<option value="d">Saisir dur&eacute;e</option>
<option value="df">Saisir D&eacute;but / Fin</option>
</select>






infos option 1

infos option 2





largement améliorable, mais j'ai voulu "conserver l'origine".

remarques sur select : s'il ne possède pas de size ( ou si ce
   size=1 ), la 1ère ligne est sélectionnée par défaut,
   c'est pour ça que j'ai ajouté display:none sur Div8.
   ( on peut aussi, faire autrement, style 
      onfocus=this.selectedIndex=-1; )






<hr />
            Cordialement          Bul       [mon Site]    [M'écrire]
<hr />                                    En général, c'est absurde de généraliser.
3
Réponse 2 / 10
younes371 Messages postés 502 Date d'inscription mercredi 29 décembre 2004 Statut Membre Dernière intervention 20 mars 2012
27 août 2007 à 11:47
j ai oublié à ajouté :
aussi dans le code html

infos option 1

infos option 2

Merci pour vos aides

N'importe où. 
mais là où il le faut.
0
Réponse 3 / 10
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
27 août 2007 à 12:21
au fait...
<option value="d">Saisir durée</option>
<option value="df">Saisir Début / Fin</option>
ça baigne aussi.
<hr />
                        Cordialement       Bul       [mon Site]    [M'écrire]
<hr />

                                                            En général, c'est absurde de généraliser.
0
Réponse 4 / 10
younes371 Messages postés 502 Date d'inscription mercredi 29 décembre 2004 Statut Membre Dernière intervention 20 mars 2012
27 août 2007 à 13:36
Merci bcp pour ta reponse !

Stp, si je veux faire comme cela :

<select id="duree" name="duree"
   onchange="appel(this);"><option value="0">Selectionner une option</option>
<option value="d">Saisir duree</option>
<option value="df">Saisir Debut / Fin</option>
</select>

lors de la selection de l option = 0, les deux Divs se masquent ?
Merci encore une fois

N'importe où. 
mais là où il le faut.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 10
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
27 août 2007 à 13:44
>>les deux Divs se masquent ?
    c'est une affirmation ou c'est ce que tu voudrais faire ?

dans la function appel, on teste qu'elle ligne a été choisie.
     ...

switch (sel.selectedIndex)...

                fais-y ce que tu veux.



<hr />




Cordialement                Bul         [mon Site]     [M'écrire]<hr />
En général, c'est absurde de généraliser.
0
Réponse 6 / 10
younes371 Messages postés 502 Date d'inscription mercredi 29 décembre 2004 Statut Membre Dernière intervention 20 mars 2012
27 août 2007 à 16:16
Normalement,
c ce que je veux faire,
mais comment masquer DIV7 et DIV 8 en meme temps si je selectionne "selectionnez une option" ?
merci

N'importe où. 
mais là où il le faut.
0
Réponse 7 / 10
younes371 Messages postés 502 Date d'inscription mercredi 29 décembre 2004 Statut Membre Dernière intervention 20 mars 2012
27 août 2007 à 17:21
Bon j ai fais une solution un peu banal mais ça fonctionne :
<script type="text/JavaScript">
function appel(sel)
{ switch (sel.selectedIndex)
  { 
case 0:
      aDuree('Div7','Div8');
      break;
case 1:
      aDuree('Div7','Div8');
      break;
   case 2:
      aDuree('Div8','Div7');
      break;  
  }
}

function aDuree(thingId,thingId2)
{ document.getElementById(thingId).style.display = "" ;
  document.getElementById(thingId2).style.display = "none" ;
}
function aDuree1(thingId,thingId2)
{ document.getElementById(thingId).style.display = "none" ;
  document.getElementById(thingId2).style.display = "none" ;
}
N'importe où. 
mais là où il le faut.
0
Réponse 8 / 10
younes371 Messages postés 502 Date d'inscription mercredi 29 décembre 2004 Statut Membre Dernière intervention 20 mars 2012
27 août 2007 à 17:23
correction :
 
case 0:
      aDuree1('Div7','Div8');
      break;

N'importe où. 
mais là où il le faut.
0
Réponse 9 / 10
cs_bultez Messages postés 13615 Date d'inscription jeudi 13 février 2003 Statut Membre Dernière intervention 15 octobre 2013 30
27 août 2007 à 18:20
>>

case 0:
      aDuree1('Div7','Div8');
      break;

par exemple, ou directement ?

case 0:
 


document.getElementById('Div7').style.display = "none" ;
  document.getElementById('Div8').style.display = "none" ;
  break;




<hr />




Cordialement                Bul         [mon Site]     [M'écrire]
<hr />


En général, c'est absurde de généraliser.
0
Réponse 10 / 10
younes371 Messages postés 502 Date d'inscription mercredi 29 décembre 2004 Statut Membre Dernière intervention 20 mars 2012
27 août 2007 à 19:07
oui tu as raison,
bien vu !
merci bcp pour ton aide

N'importe où. 
mais là où il le faut.
0

Discussions similaires

ajouter une option à java VM
dounatt -
Julien39 -

12 réponses
"Option base 1" ??
dream2ticia -
crenaud76 -

4 réponses
Connaitre l'option activé
cs_christophedlr -
christophedlr -

1 réponse
afficher un tableau en php
Larose_1921 -
s -

1 réponse
la division en java
cs_aliomar -
KIRAIII -

3 réponses
Rejoignez-nous