Discussion :

[DevServlet]

Bonjour

J'utilise rich:tabpanel avec switchtype="ajax" et a4j:form pour chaque onglet.

tout fonctionne bien

Maintenant je dois vérifier en quittant l'onglet (vers un autre onglet ou bien en quittant la page) si les modifications éventuelles ont été sauvegardés.

Dans le cas contraire lancer une alerte pour dire "vous n'avez pas sauvegardé vos modifs, celles ci seront perdues".

Quelqu'un a une idée?

Je suis partie sur onchange sur chaque champ pour modifier un boolean ( trop lent) avec valueChangeListener dans <rich:tabPanel> mais l'action se déclenche qu'on est déjà un le deuxième onglet.


Merci de vos lumières

[romaintaz]

Je ne crois pas qu'il y ait de solution toute prête pour ça...

Une idée : ajouter une méthode Javascript changeInput() qui sera appelée dans les onchange de chaque input présent dans ton tabPanel. Cette méthode mettra simplement un booléen à true.
Par exemple :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
<input type="hidden" id="tabModifiee" value="false"/>
<script type="text/javascript">
    function changeInput() {
        $("tabModifiee").value = true;
    }
 
    function peutChangerDeTab() {
        return ($F('tabModifie') != "true") || prompt("Des données ont été modifiées. Voulez-vous quitter l'onglet ?");
    }
</script>
...
<h:inputText ... onchange="changeInput();"/>

Dans le bouton utilisé pour changer l'onglet actuel, tu fais ce code :

Code :

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

... onclick="return peutChangerDeTab();"/>

Explications :
La méthode peutChangerDeTab va retourner true uniquement si la valeur du champ caché tabModifie est différente de true ($F('tabModifie') != "true") - donc que la méthode changeInput() n'a jamais été appelée - ou que l'utilisateur réponde par oui à la popup Javascript (prompt(...)).

Si la méthode peutChangerDeTab retourne false, alors le clic ne sera pas exécuté (i.e. l'utilisateur ne change pas d'onglet). Si elle retourne true, alors l'utilisateur changera d'onglet...

[Sniper37]

Une autre solution, est l'utilisation d'un validator, soit l'ajouter à un composant de la page, ou à un inputhidden, si il y'a erreur de validation, il ne sera pas possible de changer d'onglet vu que le switchType est ajax ou server.

Par contre là ce n'est pas juste une alerte, l'utilisateur ne pourra pas passer à un autre onglet s'il ne valide pas.

[romaintaz]

Ouais mais là, si l'utilisateur modifie un champ sans faire d'erreur de validation, la modification sera perdue sans mettre en garde l'utilisateur !

[Sniper37]

Ouais mais là, si l'utilisateur modifie un champ sans faire d'erreur de validation, la modification sera perdue sans mettre en garde l'utilisateur !

la méthode de validation peut être personnalisable, on peut vérifier si il y'a eu sauvegarde ou pas, comme pour la validation de plusieurs composants à la fois.