3 Replies Latest reply on Apr 26, 2011 9:52 AM by Patrick Mingard

    How to expand a panelMenuGroup ?

    Patrick Mingard Newbie

      Hi everyone,

       

      I'm currently facing a problem with RichFaces (I do use 3.3.2.SR1 on a JBoss 5.1.0 server.

       

      I do have a menu, quite simple, which looks like :

       

      <rich:panelMenu id="leftNavigation" mode="ajax">

        <rich:panelMenuGroup label="#{msgs.agenda}" id="menuAgendaData" iconCollapsed="disc" iconExpanded="disc">

          <rich:panelMenuItem label="#{msgs.search}" reRender="leftNavigation,content">

            <a4j:actionparam name="include" value="searchAgenda.xhtml" assignTo="#{NavigationBean.contentInclude}" />

          </rich:panelMenuItem>

        </rich:panelMenuGroup>

        // other panelMenuGroups for other actions

      </rich:panelMenu>

       

      The main content place of our website consist of this code :

       

      <h:form id="contentForm">

        <rich:panel id="content" style="...">

          <ui:include src="#{NavigationBean.contentInclude}" />

        </rich:panel>

      </h:form>

       

      When user click on any panelMenuItem, the NavigationBean.contentInclude property is updated with the JSF page to include in the center of the site. I guess the include style of programming is quite common with RichFaces.

       

      Now, I have another page that have a link to searchAgenda.xhtml, in another place of my application. The link is not in the menu but in the "content" panel. The link perfectly works and send the user to the searchAgenda.xhtml page. For the ease-of-use of the application, I wish to open the panelMenuGroup identified by "menuAgendaData", because it is the one that would have been expanded if the user would have arrived by clicking in the menu on the left.

       

      I read in the official documentation page http://docs.jboss.org/richfaces/latest_3_3_X/en/devguide/html/rich_panelMenuGroup.html that there exist a Javascript API with "expand" and "collapse" function. I would like to know how to call these.

       

      Here is what my link pointing to the page looks like :

       

      <a4j:commandLink value="#{msgs.searchAgenda}" action="#{AgendaBean.search}" reRender="mainNavigation,leftNavigation,content" oncomplete="Richfaces.expand('menuAgendaData');">

        <a4j:actionparam name="include" value="searchAgenda.xhtml" assignTo="#{NavigationBean.contentInclude}" />

      </a4j:commandLink>

       

      The only difference is, that coming from this link call the AgendaBean.search function, which initialise the calendar to print to the user (coming from the menu will display a form to search the calendar). It also render the mainNavigation panel, which is not important here.

       

      The "Richfaces.expand('menuAgendaData') in the "oncomplete" does not work, neither does other things like "document.getElementById('menuAgendaData').expand()" or juste "expand('menuAgendaData')".

       

      Using a4j:log element did help me find the error message, which is always :

       

      error[16:27:50,165]: Error evaluate oncomplete function undefined

       

      I just dont get how to use the Javascript API, and searching on this forum did not help me, it seems that all "expand" or "collapse" references are in topics dedicated to rich trees, which do not help me much.

       

      Is it right to place the code to expand the panelMenuGroup in "oncomplete" ?

      What would be the code to call this Javascript API ?

       

      Thank you in advance for any help or suggestions.

       

      Edit : sorry, could not find how to add code in the editor...