我有一个带有上下文菜单的分页 PrimeFaces 数据表,我希望实现多选,其中上下文菜单中的菜单项将取决于所选项目的数量,因为某些操作仅在仅选择一项时可用,而其他将在选择一个或多个时有效。
我的第一个想法是使用在控制器 bean 中设置的单个菜单项的“渲染”选项。这种工作,因为确实显示了正确的菜单项。问题是使用菜单项的渲染功能会导致数据表上的选择丢失,从而违背了练习的目的。
<p:dataTable id="orders" dynamic="true" var="item" rowKey="#{item.id}" value="#{ordersController.orders}"
emptyMessage="#{uistrings['datatable.nodata']}" paginator="true" paginatorPosition="both"
paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink}"
paginatorAlwaysVisible="false" rows="10" selectionMode="multiple" selection="#{ordersController.selectedOrders}" widgetVar="orderList">
<p:ajax event="sort" listener="#{ordersController.onSort}" update="orders"/>
<p:ajax event="rowSelect" update="contextMenu"/>
<p:ajax event="rowUnselect" update="contextMenu"/>
<p:column id="balance_date" sortBy="#{item.balanceDate}">
<f:facet name="header">
<h:outputText value="#{uistrings['orders.column.label.balancedate']}"/>
</f:facet>
<h:outputText value="#{item.balanceDate}">
<f:converter converterId="isoDateTimeConverter"/>
<f:attribute name="#{webUiConstBean.ISO_CONVERTER_ATTRIBUTE_TYPE}" value="#{webUiConstBean.ISO_DATE_CLASS}" />
<f:attribute name="#{webUiConstBean.ISO_CONVERTER_ATTRIBUTE_PATTERN}" value="#{webUiConstBean.ISO_DATE_FORMAT}" />
</h:outputText>
</p:column>
<p:column id="recipient_name" sortBy="#{item.recipient.displayName}">
<f:facet name="header">
<h:outputText value="#{uistrings['orders.column.label.recipient.displayName']}"/>
</f:facet>
<h:outputText value="#{item.recipient.displayName}"/>
</p:column>
[snip]
</p:dataTable>
<p:contextMenu id="contextMenu" for="orders">
<p:menuitem value="#{uistrings['orders.menu.details']}" update="details, orders"
oncomplete="detailDialog.show()" icon="ui-icon-search" rendered="#{ordersController.renderDisplayDetails}" />
<p:menuitem value="#{uistrings['orders.button.label.delete']}" icon="ui-icon-trash"
update="orders" ajax="true" onclick="confirmDelete.show()"
rendered="#{ordersController.renderDeleteDocuments}"/>
</p:contextMenu>
在这个论坛和其他论坛中寻找解决方案,找到一些提示,并自己想出一些替代方案后,我做了其他一些尝试,包括:
1) 使用两个完整的上下文菜单:一个用于选择一个项目,另一个用于选择多个项目,并使用上下文菜单本身的渲染选项,而不是它们的项目。
在这种情况下,rowSelect 和 rowUnselect 事件同时更新
<p:ajax event="rowSelect" update="contextMenu1Selected contextMenuManySelected"/>
<p:ajax event="rowUnselect" update="contextMenu1Selected contextMenuManySelected"/>
上下文菜单看起来像这样
<p:contextMenu id="contextMenu1Selected" for="orders" rendered="#{ordersController.render1Selected}">
<p:menuitem value="#{uistrings['orders.menu.details']}" update="details, orders"
oncomplete="detailDialog.show()" icon="ui-icon-search"/>
<p:menuitem value="#{uistrings['orders.button.label.delete']}" icon="ui-icon-trash"
update="orders" ajax="true" onclick="confirmDelete.show()"/>
</p:contextMenu>
<p:contextMenu id="contextMenuManySelected" for="orders" rendered="#{ordersController.renderManySelected}">
<p:menuitem value="#{uistrings['orders.button.label.delete']}" icon="ui-icon-trash"
update="orders" ajax="true" onclick="confirmDelete.show()"/>
</p:contextMenu>
但这根本不起作用。没有显示任何菜单。
2) 将两个上下文菜单放在 outputPanel 中,并更新面板。这与我第一次尝试的结果相同。即菜单项正确呈现但丢失选择
<p:outputPanel id="contextMenuPanel" autoUpdate="true">
<p:contextMenu id="contextMenu1Selected" for="orders" rendered="#{ordersController.renderDisplayDocument}">
[menu items]
</p:contextMenu>
<p:contextMenu id="contextMenuManySelected" for="orders" rendered="#{ordersController.renderDeleteDocuments}">
[menu items]
</p:contextMenu>
</p:outputPanel>
3) 使用控制器提供的 menuModel 定义 contextMenu 模型,它本身有两个模型可用于两种情况,并根据所选项目的数量提供正确的模型。也在输出面板中
<p:outputPanel id="contextMenuPanel" autoUpdate="true">
<p:contextMenu id="contextMenu" for="orders" model="#{ordersController.menuModel}"/>
</p:outputPanel>>
这也没有奏效。MenuItems 正确呈现,但多选丢失和以前一样。
我已经用尽了我知道的选项。
有没有人成功地为带有多选的数据表实现了动态上下文菜单?
或者有没有人有任何进一步的想法可能有效?
干杯。