5 Replies Latest reply on Oct 2, 2009 3:41 PM by wagied davids

    Using contectMenu with richTree?

    Prathamesh Gaddam Novice
      Dear replier,

      I'hv tried to navigate next-page (Edit, with contextMenu action=)on tree node selection. I'm unable to use the rich:componentControl, with rich:contextMenu code outside the rich:tree.

      However the contextMenu code works within/inside the rich:treeNode works, partially i.e the action (to Edit page) is not invoked for the nodes 2 and/or 3 hierarchy.

      Any help/clue is appreciated. Thank you in advance.

      CODE:

      TasksTree.xhtml
      `
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      <ui:composition xmlns="http://www.w3.org/1999/xhtml"
           xmlns:s="http://jboss.com/products/seam/taglib"
           xmlns:ui="http://java.sun.com/jsf/facelets"
           xmlns:a="http://richfaces.org/a4j"
           xmlns:f="http://java.sun.com/jsf/core"
           xmlns:h="http://java.sun.com/jsf/html"
           xmlns:rich="http://richfaces.org/rich"
           template="layout/template.xhtml">
           
      <ui:define name="body">

      <a:form id="tasksSearch" styleClass="edit">
           
                <!-- CONTEXT MENU
                <rich:contextMenu attached="true" id="treeMenu" submitMode="ajax">
                     <rich:menuItem>
                                   Selected Task ID:<b>{taskId}</b>
                     </rich:menuItem>
                     <rich:menuItem action="Edit">
                            <h:graphicImage value="/img/edit.gif" border="0"></h:graphicImage>
                            <h:outputText value="#{resourceBundle.labels['list.edit']}"></h:outputText>
                            <a:actionparam  name="tasksId" value="{tasksId}"/>
                     </rich:menuItem>
                </rich:contextMenu>
                 -->
                
                <!-- TREE -->        
              <rich:panel>
                   <rich:tree id="tasksTree" switchType="client">
                           <rich:recursiveTreeNodesAdaptor roots="#{tasksHome.instance.tasks == null? tasksHome.instance : tasksHome.instance.tasks}" var="taskItem" nodes="#{taskItem.taskses}">
                             <rich:treeNode icon="/img/down.gif">
                                  <h:outputText value="#{taskItem.id}"/>
               
                <!-- Inner contextMenu -->                       
                <rich:contextMenu event="oncontextmenu" attached="true" id="treeMenu" submitMode="ajax">
                     <rich:menuItem>
                                   Selected Task ID:<b>#{taskItem.id}</b>
                     </rich:menuItem>
                     <rich:menuItem action="Edit" limitToList="true">
                            <h:graphicImage value="/img/edit.gif" border="0"></h:graphicImage>
                            <h:outputText value="#{resourceBundle.labels['list.edit']}"></h:outputText>
                            <f:param name="tasksId" value="#{taskItem.id}"/>
                     </rich:menuItem>
                </rich:contextMenu>
                <!-- Inner contextMenu -->
                
                             </rich:treeNode>
                        </rich:recursiveTreeNodesAdaptor>
                
                          <!-- ComponentControl within TREE
                          <rich:componentControl event="onSelected" attachTo="tasksTree" for="treeMenu" operation="show">
                                <f:param name="taskId" value="#{taskItem.id}"/>
                       </rich:componentControl>                 
                           -->
                                               
                     </rich:tree>
                </rich:panel>

      </a:form>
      </ui:define>
      </ui:composition>     
      `
      TaskTree.page.xml

      `
      <?xml version="1.0" encoding="UTF-8"?>
      <page xmlns="http://jboss.com/products/seam/pages"
            xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
            xsi:schemaLocation="http://jboss.com/products/seam/pages http://jboss.com/products/seam/pages-2.0.xsd">
           
         <param name="tasksId" value="#{tasksHome.tasksId}"/>
         <param name="taskId"/>
        
         <navigation from-action="Edit">
                <end-conversation />
                <redirect view-id="/TasksEdit.xhtml" />
           </navigation>
      </page>  
      `
        • 1. Re: Using contectMenu with richTree?
          wagied davids Newbie

          Hi,


          have the same problem.
          Great if you could share your code.


          • 2. Re: Using contectMenu with richTree?
            Prathamesh Gaddam Novice
            Hi Wagied Davids,

            I'm just in hurry to recall the the thing. However the following code worked for me. Have it and explore! 

            <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
            <ui:composition xmlns="http://www.w3.org/1999/xhtml"
                 xmlns:s="http://jboss.com/products/seam/taglib"
                 xmlns:ui="http://java.sun.com/jsf/facelets"
                 xmlns:a="http://richfaces.org/a4j"
                 xmlns:f="http://java.sun.com/jsf/core"
                 xmlns:h="http://java.sun.com/jsf/html"
                 xmlns:rich="http://richfaces.org/rich"
                 template="layout/template.xhtml">
                 
            <ui:define name="body">

            <a:form id="tasksSearch" styleClass="edit">
                 
                      <!-- CONTEXT MENU
                      <rich:contextMenu attached="true" id="treeMenu" submitMode="ajax">
                           <rich:menuItem>
                                         Selected Task ID:<b>{taskId}</b>
                           </rich:menuItem>
                           <rich:menuItem action="Edit">
                                  <h:graphicImage value="/img/edit.gif" border="0"></h:graphicImage>
                                  <h:outputText value="#{resourceBundle.labels['list.edit']}"></h:outputText>
                                  <a:actionparam  name="tasksId" value="{tasksId}"/>
                           </rich:menuItem>
                      </rich:contextMenu>
                       -->
                      
                      <!-- TREE -->        
                    <rich:panel>
                         <rich:tree id="tasksTree" switchType="client">
                                 <rich:recursiveTreeNodesAdaptor roots="#{tasksHome.instance.tasks == null? tasksHome.instance : tasksHome.instance.tasks}" var="taskItem" nodes="#{taskItem.taskses}">
                                   <rich:treeNode icon="/img/down.gif">
                                        <h:outputText value="#{taskItem.id}"/>
                     
                      <!-- Inner contextMenu -->                       
                      <rich:contextMenu event="oncontextmenu" attached="true" id="treeMenu" submitMode="ajax">
                           <rich:menuItem>
                                         Selected Task ID:<b>#{taskItem.id}</b>
                           </rich:menuItem>
                           <rich:menuItem action="Edit" limitToList="true">
                                  <h:graphicImage value="/img/edit.gif" border="0"></h:graphicImage>
                                  <h:outputText value="#{resourceBundle.labels['list.edit']}"></h:outputText>
                                  <f:param name="tasksId" value="#{taskItem.id}"/>
                           </rich:menuItem>
                      </rich:contextMenu>
                      <!-- Inner contextMenu -->
                      
                                   </rich:treeNode>
                              </rich:recursiveTreeNodesAdaptor>
                      
                                <!-- ComponentControl within TREE
                                <rich:componentControl event="onSelected" attachTo="tasksTree" for="treeMenu" operation="show">
                                      <f:param name="taskId" value="#{taskItem.id}"/>
                             </rich:componentControl>                 
                                 -->
                                                     
                           </rich:tree>
                      </rich:panel>

            </a:form>
            </ui:define>
            </ui:composition>     




            • 3. Re: Using contectMenu with richTree?
              wagied davids Newbie

              <ui:composition xmlns="http://www.w3.org/1999/xhtml"
                      xmlns:s="http://jboss.com/products/seam/taglib"
                      xmlns:ui="http://java.sun.com/jsf/facelets"
                      xmlns:h="http://java.sun.com/jsf/html"
                      xmlns:f="http://java.sun.com/jsf/core"
                      xmlns:a4j="http://richfaces.org/a4j"
                      xmlns:rich="http://richfaces.org/rich">


                      <a4j:form id="treeForm">

                              <h:outputText value="No Projects exist"
                                      rendered="#{  empty treeHome.allProjects }" />




                              <rich:tree id="tree" value="#{treeHome.rootNode}" var="item"
                                      style="width:300px" showConnectingLines="true"
                                      nodeSelectListener="#{treeHome.processSelection}"
                                      adviseNodeOpened="#{treeMenuAction.adviseNodeOpened}"
                                      reRender="selectedProject,selectedNode" ajaxSubmitSelection="true"
                                      switchType="client" ajaxKeys="#{null}">

                                      <rich:treeNode id="node">

                                              <h:outputText value="#{item}" style="font-weight: bold" />

                                              <rich:contextMenu event="oncontextmenu" submitMode="ajax"
                                                      attachTo="node">

                                                      <rich:menuItem ajaxSingle="true">
                                                              <h:outputText value="Project Details" style="font-weight: bold" />
                                                              <rich:menuSeparator />
                                                      </rich:menuItem>

                                                      <rich:menuItem ajaxSingle="true">
                                                              <s:link value="Create Project" view="/project.xhtml" />
                                                      </rich:menuItem>

                                                      <rich:menuItem ajaxSingle="true">
                                                              <s:link value="View Project" view="/projectList.xhtml" />
                                                      </rich:menuItem>

                                                      <rich:menuItem ajaxSingle="true">
                                                              <a4j:commandLink value="Edit Project"
                                                                      action="#{treeMenuAction.editProject}"
                                                                      reRender="selectedMenuItem">
                                                              </a4j:commandLink>
                                                      </rich:menuItem>

                                                      <rich:menuSeparator />

                                                      <rich:menuItem ajaxSingle="true">
                                                              <s:link value="Create Experiment" view="/experiment.xhtml" />
                                                      </rich:menuItem>

                                                      <rich:menuItem id="viewItem" ajaxSingle="true">
                                                              <a4j:commandLink value="View Experiment"
                                                                      action="#{treeMenuAction.viewExperiment}"
                                                                      reRender="selectedMenuItem">
                                                              </a4j:commandLink>
                                                      </rich:menuItem>

                                                      <rich:menuItem id="editItem" ajaxSingle="true">
                                                              <a4j:commandLink value="Edit Experiment"
                                                                      action="#{treeMenuAction.editExperiment}"
                                                                      reRender="selectedMenuItem">
                                                              </a4j:commandLink>
                                                      </rich:menuItem>

                                              </rich:contextMenu>

                                      </rich:treeNode>

                              </rich:tree>




                      </a4j:form>


              </ui:composition>

              • 4. Re: Using contectMenu with richTree?
                wagied davids Newbie

                Hi Prathamesh Gaddam,


                Thanks for sharing your code.
                Here is what I tried below.


                Problem, how to pass parameters when using an s:link or a4j link......



                <ui:composition xmlns="http://www.w3.org/1999/xhtml"
                     xmlns:s="http://jboss.com/products/seam/taglib"
                     xmlns:ui="http://java.sun.com/jsf/facelets"
                     xmlns:h="http://java.sun.com/jsf/html"
                     xmlns:f="http://java.sun.com/jsf/core"
                     xmlns:a4j="http://richfaces.org/a4j"
                     xmlns:rich="http://richfaces.org/rich">
                
                
                     <a4j:form id="treeForm">
                
                          <h:outputText value="No Projects exist"
                               rendered="#{  empty treeHome.allProjects }" />
                
                
                
                
                          <rich:tree id="tree" value="#{treeHome.rootNode}" var="item"
                               style="width:300px" showConnectingLines="true"
                               nodeSelectListener="#{treeHome.processSelection}"
                               adviseNodeOpened="#{treeMenuAction.adviseNodeOpened}"
                               reRender="selectedProject,selectedNode" ajaxSubmitSelection="true"
                               switchType="client" ajaxKeys="#{null}">
                
                               <rich:treeNode id="node">
                
                                    <h:outputText value="#{item}" style="font-weight: bold" />
                
                                    <rich:contextMenu event="oncontextmenu" submitMode="ajax"
                                         attachTo="node">
                
                                         <rich:menuItem ajaxSingle="true">
                                              <h:outputText value="Project Details" style="font-weight: bold" />
                                              <rich:menuSeparator />
                                         </rich:menuItem>
                
                                         <rich:menuItem ajaxSingle="true">
                                              <s:link value="Create Project" view="/project.xhtml" />
                                         </rich:menuItem>
                
                                         <rich:menuItem ajaxSingle="true">
                                              <s:link value="View Project" view="/projectList.xhtml" />
                                         </rich:menuItem>
                
                                         <rich:menuItem ajaxSingle="true">
                                              <a4j:commandLink value="Edit Project"
                                                   action="#{treeMenuAction.editProject}"
                                                   reRender="selectedMenuItem">
                                              </a4j:commandLink>
                                         </rich:menuItem>
                
                                         <rich:menuSeparator />
                
                                         <rich:menuItem ajaxSingle="true">
                                              <s:link value="Create Experiment" view="/experiment.xhtml" />
                                         </rich:menuItem>
                
                                         <rich:menuItem id="viewItem" ajaxSingle="true">
                                              <a4j:commandLink value="View Experiment"
                                                   action="#{treeMenuAction.viewExperiment}"
                                                   reRender="selectedMenuItem">
                                              </a4j:commandLink>
                                         </rich:menuItem>
                
                                         <rich:menuItem id="editItem" ajaxSingle="true">
                                              <a4j:commandLink value="Edit Experiment"
                                                   action="#{treeMenuAction.editExperiment}"
                                                   reRender="selectedMenuItem">
                                              </a4j:commandLink>
                                         </rich:menuItem>
                
                                    </rich:contextMenu>
                
                               </rich:treeNode>
                
                          </rich:tree>
                
                
                
                
                     </a4j:form>
                
                
                </ui:composition>



                • 5. Re: Using contectMenu with richTree?
                  wagied davids Newbie

                  Ideally I want to click the node and be redirected to another page, but need parameters ????