Primefaces 3.4 p:panelMenu: unable to control the state of p:submenu and p:menuitem

问题

Given the following collapsing Menu (p:panelMenu):

<p:panelMenu style="width:200px">
            <p:submenu label="#{uimsg.clm_title}" styleClass="pageFont">
                <!--                <p:menuitem value="Delete" actionListener="#{buttonBean.delete}"  ajax="true" icon="ui-icon-close"/>   -->
            </p:submenu>
            <p:separator />

            <!-- Sub-menu master Data  -->
            <p:submenu label="#{uimsg.trsf_title}" styleClass="pageFont">
                <p:menuitem value="#{uimsg.trsf_create}" ajax="true"
                    icon="ui-icon-arrow-1-e" url="/transfers/editTransfer.xhtml" />
            </p:submenu>
            <p:separator />


            <!-- Sub-menu master Data  -->
            <p:submenu label="#{uimsg.mst_data_title}" styleClass="pageFont">

                <!--  Clubs -->
                <p:submenu label="#{uimsg.mst_data_club_title}">
                    <p:menuitem value="#{uimsg.mst_data_show_club_title}" ajax="true"
                        icon="ui-icon-arrow-1-e" url="/clubs/showClubs.xhtml" />

                    <p:menuitem value="#{uimsg.mst_data_edit_club_title}" ajax="true"
                        icon="ui-icon-arrow-1-e" url="/clubs/editClub.xhtml" />
                </p:submenu>


                <!--  Associations -->
                <p:submenu label="#{uimsg.mst_data_assocation_title}">
                    <p:menuitem value="#{uimsg.mst_data_show_association_title}"
                        ajax="true" icon="ui-icon-arrow-1-e"
                        url="/associations/showAssociations.xhtml" />

                    <p:menuitem value="#{uimsg.mst_data_edit_association_title}"
                        ajax="true" icon="ui-icon-arrow-1-e"
                        url="/associations/editAssociation.xhtml" />
                </p:submenu>

                <!-- leagues -->
                <p:submenu label="#{uimsg.mst_data_league_title}">

                    <p:menuitem value="#{uimsg.mst_data_show_league_title}"
                        icon="ui-icon-arrow-1-e" url="/league/showLeagues.xhtml" ajax="true"/>

                    <p:menuitem value="#{uimsg.mst_data_edit_league_title}"
                        icon="ui-icon-arrow-1-e" url="/league/editLeague.xhtml" ajax="true"/>
                </p:submenu>

                <!-- Players -->
                <p:submenu label="#{uimsg.mst_data_player_title}">

                    <p:menuitem value="#{uimsg.player_menu_show}" ajax="true"
                        icon="ui-icon-arrow-1-e" url="/player/showPlayers.xhtml" />

                    <p:menuitem value="#{uimsg.player_menu_edit}" ajax="true"
                        icon="ui-icon-arrow-1-e" url="/player/editPlayer.xhtml" />

                </p:submenu>

                <!-- Confederation -->
                <p:submenu label="#{uimsg.mst_data_confed_title}">

                    <p:menuitem value="#{uimsg.mst_data_edit_confed_title}"
                        icon="ui-icon-arrow-1-e"
                        url="/confederations/showConfederations.xhtml" ajax="true" />

                    <p:menuitem value="#{uimsg.mst_data_show_confed_title}"
                        icon="ui-icon-arrow-1-e"
                        url="/confederations/editConfederation.xhtml" ajax="true" />

                </p:submenu>

            </p:submenu>

            <p:separator />

            <!-- Sub-menu Administration -->

            <p:submenu label="#{uimsg.admin_title}"
                rendered="#{auth.showAdministration() == true ? true : false }"
                id="adminDivId" styleClass="pageFont">
                <!-- User menu -->
                <p:submenu label="#{uimsg.users_admin_title}">
                    <p:menuitem value="#{uimsg.admin_show_users_title}" ajax="true"
                        icon="ui-icon-arrow-1-e" url="/users/showUsers.xhtml" />
                    <p:menuitem value="#{uimsg.admin_edit_users_title}" ajax="true"
                        icon="ui-icon-arrow-1-e" url="/users/editUser.xhtml"
                        disabled="#{auth.editUsers() == true ? false : true }" />
                </p:submenu>

                <!-- Role menu -->
                <p:submenu label="#{uimsg.roles_admin_title}">
                    <p:menuitem value="#{uimsg.admin_show_role_title}" ajax="true"
                        icon="ui-icon-arrow-1-e" url="/roles/showRoles.xhtml" />
                    <p:menuitem value="#{uimsg.admin_edit_role_title}" ajax="true"
                        icon="ui-icon-arrow-1-e" url="/roles/editRole.xhtml"
                        disabled="#{auth.editUsers() ne true}" />
                </p:submenu>
            </p:submenu>

            <p:separator />
            <!-- Sub-menu Version -->
            <p:submenu label="#{uimsg.abt_software_title}" styleClass="pageFont">
                <p:menuitem value="#{uimsg.abt_software_show_informations}"
                    icon="ui-icon-arrow-1-e" url="/version/showVersion.xhtml" ajax="true"/>
            </p:submenu>
</p:panelMenu>

By each click on a menuItem, the PanelMenu behaves very strangely and und unpredictablely: some subMenu's collapsed and other don't. there seems to be no fixed rules for this "jabbi-jabba".

i don't know the cause of this. I used mainly redirection in all views ("faces-redirect=true") and some views contain composite elements

does someone have a hint ?

Environment:

• AS : JBoss 7.1.1 final
• JSF version: 2.1.13
• Primesfaces: 3.4.1

回答1:

The panelMenu of primeFaces needs to save its state so that it can always show the user which submenus have been opened/closed previously. PanelMenu saves it state at the client side , using a cookie having as name the id of the panelmenu itself. The cookie is set/created by the cliend side using javascript (see js for panelmenu) and is read by Primefaces to update its menu. The cookie is set to hold the id of submenu items that have been opened by the user.

solution to the problem is:

1. make sure there is only cookie with a user-given id
2. make sure all the requests in the menu-item all goes to only one application directory

回答2:

You can do that, you need put this on component stateful="true" and in the itemMenu set the ajax=false async=false global=false partialSubmit=false resetValue=false immediate=true.

That's it.

来源：https://stackoverflow.com/questions/13726428/primefaces-3-4-ppanelmenu-unable-to-control-the-state-of-psubmenu-and-pmenui