Question

我正在使用JSF和PrimeFaces开发Web应用程序。其中一个页面显示一个实体表，我应该向表中添加一个上下文菜单。

更具体地说：最后一列包含p:menuButton，其内容取决于相应的行。 menuItems作为ui:composition存储在另一个文件中，我应该只是将它们包含在上下文菜单中。

然而，菜单项是动态的。实体确实有一个名为enabled的布尔成员。对于启用的实体，将显示“编辑”，“删除”和“禁用”。对于已禁用的实体，只有启用。

使用下面的代码，将显示上下文菜单，但只有在我通过左键单击选择另一行时才会更新内容。右键单击会选择行，但不会更新backingbean的selectedPerson。

显然，PrimeFaces 3.5有一些变化。我发现了许多对contextMenu ajax事件的引用。

但是当我将它添加到数据表中时：

<p:ajax event="contextMenu" update=":persons-form:contextMenu" />

..菜单出现但立即消失。据推测，因为一些更新方法被调用。在显示的短时间内，我可以看到它仍显示旧的菜单项。

总而言之：如何在PrimeFaces 3.5的数据表中使上下文菜单正常工作？意思是，右键单击应选择一行并在显示之前更新菜单，因为菜单项取决于行数据。

personList.xhtml：

    <p:contextMenu id="contextMenu" for="persons">
        <ui:include src="/layout/personActionMenu.xhtml">
            <ui:param name="thePerson" value="#{personListBean.selectedPerson}"/>
        </ui:include>                               
    </p:contextMenu>

    <p:dataTable id="persons" 
                 value="#{personListBean.allPersons}" 
                 var="p"
                 rowKey="#{p.id}"
                 selection="#{personListBean.selectedPerson}" 
                 selectionMode="single"
                 rowStyleClass="#{p.enabled ? '' : 'disabledTableItem'}">

        <p:ajax event="rowSelect" update=":persons-form:contextMenu"/>

        <p:column>
            <f:facet name="header">Name</f:facet>
            <h:outputText value="#{p.name}" />
        </p:column>                 

        <p:column>
            <p:menuButton value="Actions">
                <ui:include src="/layout/personActionMenu.xhtml">
                    <ui:param name="thePerson" value="#{p}"/>
                </ui:include>
            </p:menuButton>
        </p:column>

    </p:dataTable>

</h:form>

personActionMenu.xhtml：

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
    xmlns:u="http://java.sun.com/jsf/composite/ui"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:p="http://primefaces.org/ui">

    <p:menuitem rendered="#{personListBean.isEnabled(thePerson)}" outcome="edit.xhtml" value="Edit" icon="ui-icon-gear">
        <f:param name="id" value="#{thePerson.id}" />
    </p:menuitem>

    <p:menuitem actionListener="#{personListBean.deletePerson(thePerson)}"  value="Delete" update=":person-form" 
                icon="ui-icon-close" rendered="#{personListBean.isEnabled(thePerson)}"/>

    <p:menuitem actionListener="#{personListBean.toggleEnabled(thePerson)}" update=":persons-form" value="#{personListBean.toggleEnabledMenuItemLabel(thePerson)}" />

</ui:composition>

Answer 1

请试试这个：

<p:contextMenu id="contextMenu" for="persons" widgetVar="ctxMenu" beforeShow="return true;">
    <ui:include src="/layout/personActionMenu.xhtml">
        <ui:param name="thePerson" value="#{personListBean.selectedPerson}"/>
    </ui:include>                               
</p:contextMenu>

<p:dataTable ...>
   ...
   <p:ajax event="contextMenu" update=":persons-form:contextMenu" oncomplete="ctxMenu.show(currentEvent);" />
   ...
</p:dataTable ...>

这取自PF forum中的CannyDuck帖子。

希望这也适合你。

PrimeFaces 3.5：数据表中特定于行的上下文菜单

1 个答案: