Discussion :

[snaxisnake]

Bonjour à tous,

Je voudrais changer les options d'un formulaire, suivant le choix d'un select

Voici le select en question

Code :

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

1
2
 
<select name="type" id="type" onchange="affichelivre('divlivre');">

Et suivant le choix fait, des options apparaissent, sous forme de div.

Par exemple si on sélectionne "Livre", il devrait apparraitre le div suivant:

Code :

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

1
2
3
 
<div id="divlivre">												                         <tr><td>Nombre de pages</td><td><input type="text" name="page"></td></tr>												                         <tr><td> Auteur</td><td><input type="text" name="auteur"></td></tr>													                     <tr><td> Éditeur</td><td><input type="text" name="editeur"></td></tr>
													              </div>

... par l'intermédiaire de cette fonction

Code :

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

1
2
3
4
5
6
7
8
9
 
function affichelivre(div){
var div=document.getElementById(div);
var sujet=document.getElementById('type').options[document.getElementById('type').selectedIndex].value;
if (sujet=="3")	
div.style.display= "";
else
div.style.display = "none";
}

Cela ne fonctionne malheureusement pas...

Merci!

[Bovino]

le onchange est effectif lorsque :

• un champ a pris le focus
• sa valeur a changé
• il a perdu le focus

Lorsque tu cliques sur une option, ton select a toujours le focus, donc l'événement n'est pas déclenché...

[snaxisnake]

Même quand il perd le focus, cela ne fonctionne pas...

Sinon, comment peut-on mettre une div qui soit "invisible" dès le chargement du formulaire

[Bovino]

Code :

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

div.style.display=sujet=="3"?"block":"none";

[snaxisnake]

Si je mets:

Code :

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

1
2
3
4
5
 
#divlivre{
display:none;
visibility:hidden;
}

Pour cette div:

Code :

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

1
2
3
4
5
6
 
<div  id="divlivre">
												                         <tr><td>Nombre de pages</td><td><input type="text" name="page"></td></tr>
												                         <tr><td> Auteur</td><td><input type="text" name="auteur"></td></tr>
													                     <tr><td> Éditeur</td><td><input type="text" name="editeur"></td></tr>
													              </div>

Cela ne devrait pas cacher la div?

Merci

[Bovino]

display:none et visibility:hidden cachent tous les deux la div, la différence est que visibility conserve l'espace d'affichage par défaut et pas display.

EDIT:
Cependant, mettre les deux est redondant et oblige à affecter deux styles pour pouvoir afficher la div, en fonction de ce que tu souhaites, il est préférable d'utiliser l'un ou l'autre...

[Matthieu2000]

visibility:hidden;

lol afficher un objet invisible, et on voit ... rien...

[snaxisnake]

display:none et visibility:hidden cachent tous les deux la div, la différence est que visibility conserve l'espace d'affichage par défaut et pas display.

J'ai pourtant mis les deux, et ils s'affiche quand même Je deviens fou! lol

[SpaceFrog]

Code :

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

div.style.display=(sujet=="3")?"block":"none";

[snaxisnake]

Code :

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

div.style.display=(sujet=="3")?"block":"none";

Cela permet de faire quoi exactement?

[Bovino]

si sujet vaut "3", on met le display de l'élément 'div' à block, sinon à none...

[snaxisnake]

Ok! Merci!