Process primefaces menu before show

Question

I have a primefaces menu which items are disabled on a condition from backing bean. The problem is, that the conditions are processed after the update.

If I select a node which has every item enabled and switch to a node where everything is disabled, the menu is reloaded but shows everything enabled for a second before the items are disabled.

Is there a way to process the disabled-conditions before the menu is shown?

<h:form id="form">
    <p:tree id="tree" ...>
        <p:ajax event="select" update=":form:tree:menu" listener...>
        <p:treeNode id="treenode">
            <p:commandButton id="btn" type="button" />
            <p:overlayPanel for="btn">
                <p:menu id=menu">
                    <p:menuitem .... disabled="#{bean.condition1}" />
                    <p:menuitem .... disabled="#{bean.condition2}" />
                    ...
                </p:menu>
        </p:overlayPanel>
    </p:treenode>
</p:tree>

The type="button" makes it a dead client side button, not a submit button which interacts with server with ajax magic and all. Perhaps you wasn't aware of that? — BalusC
@BalusC You are right, I removed the ajax stuff from the button. Following the Primefaces Showcase, the type=button is neccessary for the overlayPanel-magic. As far as I understand the update is triggered by the select-event, not the button. Btw: Using the button with type=submit did not solve the problem. — sinclair

Javier Haro Javier Haro · Accepted Answer · 2015-10-15T16:39:56

EDITED

Hide the menu items at the beggining of the ajax call and show them when it is completed. The source code in the page would be:

<p:tree id="tree" value="#{bean.root}" var="node" selectionMode="checkbox">
    <p:treeNode id="treenode">
        <p:commandButton id="btn" value="#{node}"
                 onstart="$('.ui-overlaypanel-content').css('display','none');" 
                 oncomplete="$('.ui-overlaypanel-content').css('display','block');"
                 actionListener="#{bean.processAndUpdateConditions}" update="mymenu"/>
        <p:overlayPanel for="btn">
            <p:menu id="mymenu" >
                <p:menuitem  value="Condition 1" disabled="#{bean.condition1}" />
                <p:menuitem value="Condition 2" disabled="#{bean.condition2}" />
            </p:menu>
        </p:overlayPanel>
    </p:treeNode>
</p:tree>

Process primefaces menu before show

1 Answers