Bonjour,

J'ai un formulaire dans lequel je souhaite afficher un des trois PanelGroup en fonction d'un bouton radio sélectionné. J'ai utilisé du Javasccript mais ça ne fonctionne pas.

Le code est le suivant:
Code xml : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
<h:form id="form">
    <h:selectOneRadio id="mesradio" onchange="showSection(this.form)">
        <f:selectItem itemValue="sect1" itemLabel="Show section1" />
        <f:selectItem itemValue="sect2" itemLabel="Show section2" />
        <f:selectItem itemValue="sect3" itemLabel="Show section3" />
    </h:selectOneRadio>
 
    <h:panelGrid id="section1" class="section">section1</h:panelGrid >
    <h:panelGrid id="section2" class="section">section2</h:panelGrid>
    <h:panelGrid id="section3" class="section">section3</h:panelGrid>
    <h:panelGrid id="section4" class="section">section4</h:panelGrid>
 
</h:form>
le code Javascript est le suivant:
Code html : 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
<script type="text/javascript">
 
                    function showDisplay() {
                      var show=document.getElementById("mesradio").click();
                       var sec1=document.getElementById("monform:sect1");
                       var sec2=document.getElementById("monform:sect2");
                       var sec3=document.getElementById("monform:sect3");
                       switch(show)
                       {
                       case"sect1":
                           sec1.style.display.block = "block";
                           sec2.style.display.none = "none";
                           sec3.style.display.none = "none";
                           break;
                       case"sect2":
                           sec2.style.display.block = "block";
                           sec1.style.display.none = "none";
                           sec3.style.display.none = "none";
                           break;
                       case"sect3":
                           sec3.style.display.block = "block";
                           sec1.style.display.none = "none";
                           sec2.style.display.none = "none";
                           break;
                       }
 
                    }
Quelqu'un saurait-il m'indiquer comment résoudre ce problème ?

Merci d'avance pour votre aide.