Discussion :

[azassma]

Bonjour,
J'ai une page qui contient plusieurs onglets (tabview primefaces) et je veux quand je rempli le formulaire d'une onglet et que je clique sur confirmer, je passe à un autre onglet.

Voila le code de la page qui contient mes onglets :

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
 
            <h:panelGrid  style="font-size: 12px;">
                <p:tabView>
                    <p:tab title="Constater affaire">
                        <ui:include src="constatationAffaire.xhtml"/>
                    </p:tab>
                    <p:tab title="Infracteurs">
                        <ui:include src="infracteursPhysique.xhtml"/>
                    </p:tab>
                    <p:tab title="Infractions">
                        <ui:include src="infractions.xhtml"/>
                    </p:tab>
                    <p:tab title="Verbalisateurs">
                        <ui:include src="verbalisateurs.xhtml"/>
                    </p:tab>
                </p:tabView>
            </h:panelGrid>

Je suis dans l'onglet "constater affaire" et je veux atteindre l'onglet "infracteurs" en cliquant sur le bouton "Confirmer"
Voila le code la page constatationAffaire.xhtml

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
 
    <ui:composition>
        <center>
            <h:form>
                <p:panel style="width: 900px;height: 625px;margin-top: 8px; font-size: 13px;">
                    <br/>
 
                    <div class="divGlobal">
                        <h:panelGrid columns="2" style="height: 50px;">
 
                            <p:selectOneRadio id="options" style="width:770px;">
                                <f:selectItem itemLabel="Affaire de bureau" itemValue="1"/>
                                <f:selectItem itemLabel="Affaire de campagne" itemValue="2" />
                            </p:selectOneRadio>
 
                        </h:panelGrid>
 
                        <h:panelGrid columns="4" style="height: 100px;float: left;margin-left: 10px">
                            <h:outputLabel value="Mode opératoire" />
                            <p:inputTextarea rows="5" cols="33" value="#{AffaireMBean.modeOperatoire}" style="margin-left: 87px;width: 610px"/>
                        </h:panelGrid>
                        <h:panelGrid columns="2" style="height: 60px;text-align: center;">
                            <p:commandButton value="Confirmer" style="width: 180px;" action="#{AffaireMBean.constationAffaire}"/>
                            <p:commandButton value="Rétablir" style="width: 180px;margin-left: 20px"/>
                        </h:panelGrid>
                    </div>
                </p:panel>
            </h:form>
        </center>
    </ui:composition>
</html>

S'il vous plait si vous pouvez m'aider ? Merci

[N4rc0]

Je vois que tu utilises la bibliothèque Primefaces.

Ils ont développé un composant qui correspond exactement à ton besoin : Le Wizard.

Il te sera très pratique pour réaliser des tâches comme la vérification des données pour passer d'une étape à une autre.

Mais si tu n'a pas envie de changer de composant, tu as tout de même une astuce, en regardant la documentation, si tu te rend à la partie concernant les tabview, tu pourras voir une sous-partie appelée "Client Side API".
Cette partie t'indique les méthodes disponibles pour le composant et ce depuis le côté client (ta page xhtml).

En gros, il te suffirait de faire par exemple

Code :

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

1
2
 
<p:commandButton value="Confirmer" style="width: 180px;" action="#{AffaireMBean.constationAffaire}" oncomplete="mon_tabview_widgetvar.select(index_voulu)"/>

Mais la meilleure solution reste l'utilisation du Wizard, car cette dernière méthode, te passera à l'onglet suivant quoiqu'il arrive (à moins que tu décides de te compliquer la tâche avec des "handles").

[azassma]

Meeeeeeeeeeeeeeeerci beaucoup c'est résolu

Mais il reste un petit problème c'est que lorsque ça passe à l'autre onglet la méthode appelée par action du bouton ne s’exécute pas !!!

[N4rc0]

Tu as utilisée laquelle de mes solutions ? Le Wizard ?

Pourrais-tu nous poster ton code xhtml, et la méthode associée de ton bean ?

[azassma]

Voila le code

Code :

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

1
2
3
4
5
 
<h:panelGrid id="constatationaffaire" columns="2" style="height: 60px;text-align: center;margin-top: 100px">
                            <p:commandButton value="Confirmer" style="width: 180px;" action="#{AffaireMBean.constationAffaire}" oncomplete="tabCreationAffaire.select(1)"/>
                            <p:commandButton value="Rétablir" style="width: 180px;margin-left: 20px"/>
                        </h:panelGrid>

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
 
<p:tabView widgetVar="tabCreationAffaire">
                    <p:tab title="Constater affaire" >
                        <ui:include src="constatationAffaire.xhtml"/>
                    </p:tab>
                    <p:tab title="Infractions">
                        <ui:include src="infractions.xhtml"/>
                    </p:tab>
                    <p:tab title="Verbalisateurs">
                        <ui:include src="verbalisateurs.xhtml"/>
                    </p:tab>
</p:tabView>

[N4rc0]

C'est la méthode "constationAffaire" qui ne s’exécute pas ?

Pourrais-tu nous donner le code de celle-ci ?