Bonjour,

Je rencontre un petit souci, certainement de syntaxe.
J'ai une liste déroulante contenant 5 éléments.

Je souhaiterais que lorsqu'un élément est sélectionné dans cette liste, des cases à cocher correspondantes s'affichent. Puis que ces cases soient remplacées par d'autres en cas de changement de sélection dans la liste déroulante.

J'ai donc divisé chaque "lot" de cases à cocher dans des DIV distinctes, que je tente d'afficher lors de l'événement OnChange de la liste déroulante, en fonction de ce que l'utilisateur a sélectionné.
Mais ça ne fonctionne pas, j'obtiens une erreur JS "Objet attendu", et rien ne s'affiche lorsqu'un élément est sélectionné dans la liste déroulante.

Voici mon code :

- Dans HEAD (JavaScript) :

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
 
 
<script language="javascript">
 
// Fonction permettant l'affichage des cases à cocher en fonction de l'élément sélectionné dans la liste déroulante
// Chaque "lot" de cases à cocher est regroupé dans un div, identifié par un id
 
function changerub(rubrique){
 
var targetElement;
 
if(rubrique==0){
   targetElement = document.formsuivi.getElementById('touschoix');
   targetElement.style.display = "block" ;
 }
 elseif(rubrique==1){
   targetElement = document.formsuivi.getElementById('tubes');
   targetElement.style.display = "block" ;
 }
 elseif(rubrique==2){
   targetElement = document.formsuivi.getElementById('declasses');
   targetElement.style.display = "block" ;
 }
 elseif(rubrique==3){
   targetElement = document.formsuivi.getElementById('transport');
   targetElement.style.display = "block" ;
 }
 elseif(rubrique==4){
   targetElement = document.formsuivi.getElementById('divers');
   targetElement.style.display = "block" ;
 }
 
}
 
</script>

- Dans BODY (HTML) :

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
42
43
44
45
46
47
48
49
50
51
52
53
54
 
 
<form name="formsuivi" action="compta.php" method="post">
 
<!-- Liste déroulante, appel de la fonction JS lors du changement du choix de la liste déroulante
     avec comme paramètre le numéro de l'élément sélectionné (commence à 0) -->
<b>Sélectionnez une rubrique :</b>
 
    <SELECT name="rubriques" size="1" onChange="changerub(formsuivi.rubriques.selectedIndex);">
    <OPTION value="listetouschoix" selected>Tous choix
    <OPTION value="listetubes" >Tubes
    <OPTION value="listedeclasses" >Déclassés
    <OPTION value="listetransport" >Transport
    <OPTION value="listedivers" >Divers
    </SELECT>  
 
<br />
 
<!-- Lot de cases à cocher pour la première catégorie
     Paramètre display permet l'affiche ou non du bloc div
     block >> Affiché
     none >> Masqué -->
 
  <div id="touschoix" style="display:block">
   <input type='checkbox' name='expedparcode' />Expéditions par code CPS<br />
   <input type='checkbox' name='listeavis' />Liste des avis
  </div>
 
<!-- Lot de cases à cocher pour la deuxième catégorie -->
  <div id="tubes" style="display:block">
   <input type='checkbox' name='horseuropipe' />Hors Europipe<br />
   <input type='checkbox' name='europipe' />Europipe<br />
   <input type='checkbox' name='iran' />Iran<br />
   <input type='checkbox' name='plaquettes' />Plaquettes
  </div>
 
<!-- Lot de cases à cocher pour la troisième catégorie -->
  <div id="declasses" style="display:block">
   <input type='checkbox' name='parpostecommande' />Par poste de commande<br />
   <input type='checkbox' name='parcommande' />Par commande
  </div>
 
<!-- Lot de cases à cocher pour la quatrième catégorie -->
  <div id="transport" style="display:block">
   <input type='checkbox' name='transtschoix' />Tous choix
  </div>
 
<!-- Lot de cases à cocher pour la cinquième catégorie -->
  <div id="divers" style="display:block">
   <input type='checkbox' name='fournitures' />Fournitures gratuites interservises LAF<br />
   <input type='checkbox' name='suiviagp' />Suivi AGP<br />
   <input type='checkbox' name='ziegel' />Ziegelander<br />
   <input type='checkbox' name='dicut' />Dicut
   </div>
Je vous remercie par avance,
Alex