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