0 Replies Latest reply on Jan 14, 2008 12:50 PM by naql

    Help for Tree Component

    naql

      I'm hoping that someone can help me with a little dilemma I'm encountering using a rich:tree tag. I am displaying a tree and I want the user to be able to navigate through the tree, click on a link in a tree node in order to pop up an editor modal pane. I would like for this tree to preserve it's state so that when the page is refreshed the tree will display the same expanded/collapsed state.

      Initially, I tried nodeSelectionListeners but, I found that the editor pane popped up when the user single clicked on any node. Eventually I ended up embedding a command link within the tree node, and this worked perfectly, but only if I made the tree use the "client" model, as shown below:

       <h:form id="paletteTreeForm" style="margin:0px; padding 0:px;">
       <rich:tree
       id="paletteTree"
       switchType="client"
       value="#{scenarioManager.scenarioTree}"
       var="item"
       stateVar="state"
       nodeFace="#{item.iconTypeName}"
       showConnectingLines="true"
       changeExpandListener="#{uiManager.processExpansion}"
       immediate="true"
       >
       <rich:treeNode type="#{item.iconTypeName}"
       iconLeaf="#{item.iconImagePath}"
       icon="#{item.iconImagePath}"
       >
       <h:outputText rendered="#{!item.editingAllowed}" value="#{item.name}" />
       <a4j:commandLink
       id="nodeEdit"
       styleClass="treeLink"
       value="#{item.name}"
       oncomplete="Richfaces.showModalPanel('#{item.editorPanelName}',{top:50, left:200});"
       title="Edit #{item.name}"
       rendered="#{item.editingAllowed}"
       immediate="true"
       action="#{iconicManager.startEdit(item)}" />
       </rich:treeNode>
       </rich:tree>
       </h:form>
      


      When I had the tree set to the "ajax" mode instead of client, I found that the "onComplete" would get invoked causing the modal pane to be displayed, but the actual action of the comman dlink would NOT and I rely upon this call to start my transaction. So, the application would crap out when the user closed the modal editor pane by hitting update or cancel. So, I was forced to use the "client" mode.

      So, my command links work exactly the way I want, the tree works exactly the say I want, but I need to preserve the state. OK, so I *think* that I need to implement some sort of "stateAdvisor" and I *think* that this involves having the tree component call this server side component whenver nodes are expanded or collapsed so that I can keep track of them. Then, I *think* that I would need to set the tree to point to this "stateAdvisor" so that when it re-renders it knows whether nodes should be open or closed. I would love to see some example code regarding this. So, in experimenting, I added the following lines:

      changeExpandListener="#{uiManager.processExpansion}"
      immediate="true"


      ...to the rich:tree tag. But, the processExpansion method does not fire, presumably because I have the tree set to "client" mode. WHen I change it to "ajax", the method gets invoked, but then I'm back to my original problem where the command:link action method does NOT get invoked, but the onComplete javascript is displaying the modal pane.

      If anyone could please advise or direct me to some examples, I would appreciate it very much.

      Thanks.