Discussion :

[CheepCheep]

Bonjour,

J'ai créé un arbre avec Primefaces et je souhaite que, lorsqu'on sélectionne un mot de l'arbre, des informations propres à ce mot s'affichent dynamiquement dans ma page. Pour les informations contenues dans des int et des String, tout fonctionne bien, en revanche lorsqu'il s'agit de listes (ArrayList<String>) j'ai besoin d'actualiser ma page pour que les informations apparaissent.

Pour l'instant j'ai mis des informations en dure (plus tard il faudra aller les chercher en base de données puisqu'elles doivent être propre à chaque mot), donc actuellement rien ne s'affiche quand la page s'ouvre et, à la sélection d'un mot, les informations apparaissent (changer de mot ne change donc rien ensuite, c'est juste pour tester le bon fonctionnement de l'affichage).

Voici le code de la fonction de sélection d'un mot de l'arbre dans ma classe TreeBean :

Code Java :

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

1
2
3
4
5
6
7
8
9
public void onNodeSelect(NodeSelectEvent event) {
      this.nom = this.selectedNode.toString();
      this.info1= "10";
      ArrayList<String> temp = new ArrayList<String>();
      String s = "nouveau terme";
      temp.add(s);
      this.info2= temp;
      this.date = "10/10/10";
}

info1 est un int, nom est un String et info2 est une ArrayList<String>.

Voici le code de mon arbre :

Code JSF :

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

1
2
3
4
5
6
7
8
9
<h:form id="form">  
<p:tree value="#{treeBean.root}" var="node" dynamic="true" cache="true" selectionMode="single"  selection="#{treeBean.selectedNode}" id="tree">
      <p:ajax event="expand" listener="#{treeBean.onNodeExpand}" />  
      <p:ajax event="select" update=":testOut1,:testOut2,:testOut3,:testOut4" listener="#{treeBean.onNodeSelect}" />
      <p:treeNode>  
            <h:outputText value="#{node}"/>  
      </p:treeNode>  
</p:tree>  
</h:form>

Et enfin le code d'affichage de la liste (je ne met pas l'affichag int/String puisqu'il fonctionne bien) :

Code JSF :

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

1
2
3
4
5
<ul>
      <ui:repeat id="testOut2" value="#{treeBean.info2}" var="item">
            <li>#{item}</li>
      </ui:repeat>
</ul>

Voilà voilà, si je n'ai pas été claire ou s'il manque des informations n'hésitez pas à me les demander Merci d'avance !

[OButterlin]

Je n'ai pas bien compris ce que tu cherches à faire, rectifie si je me trompe.

- tu as un arbre
- quand tu cliques sur un noeud de l'arbre, tu veux afficher des informations liées au noeud dans une popup

C'est ça ?

[CheepCheep]

J'ai effectivement un arbre, et lorsque je clique sur un élément de l'arbre je veux que les informations liées à cet éléments s'affichent directement sur la page mais sans la recharger (donc c'est pas un pop-up mais c'est dynamique).

Ici ça marche pour les éléments qui ne sont pas des listes. Pour les liste, l'information ne s'affiche que quand j'actualise la page, alors que moi ce que je voudrait c'est un affichage immédiat, sans rechargement de page.

[OButterlin]

Quelle est la nature de "treeBean.info2" ?

Pour info, tu devrais utiliser un overlayPanel avec l'attribut dynamic="true", mais c'est secondaire...

[CheepCheep]

Je suis débutante en JSF (et Primefaces aussi par la même occasion) donc je ne connais pas l'overlayPanel ^^" Mais j'irais regarder la doc du coup, merci !

TreeBean.info2 est l'ArrayListe<String> dans laquelle je met la chaîne "nouveau terme" dans ma fonction onNodeSelect. C'est un attribut privée de la classe TreeBean donc.

[OButterlin]

Essaye ceci

Code :

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

1
2
3
4
5
6
7
8
<h:panelGroup  id="testOut2">
   <ul>
       <ui:repeat value="#{treeBean.info2}" var="item">
            <li>#{item}</li>
       </ui:repeat>
    </ul>
</h:panelGroup>

[CheepCheep]

Super, ça marche ! Merci beaucoup, par contre est ce que tu as une explication sur le fait que ça ne marchait pas avant (histoire que je comprenne mon erreur) ?

[OButterlin]

Le <ui:repeat> est interprété au moment de la création de la page, le fait de mettre l'id utilisé pour l'update dessus ne fait rien du coup.
Il faut l'inclure à l'intérieur d'un autre élément pour qu'il ré-évalue le contenu et relance le code <ui:repeat>
(je ne sais pas si je suis très clair là )

[CheepCheep]

Je pense avoir saisi l'idée Merci !