PrimeFaces：如何使用 selectionMode="multiple" 检查 p:column？

Question

我有一个<p:dataTable> 和一个<p:column selectionMode="multiple" />。当我在 dataTable 中显示单行时，我希望我的应用程序自动检查该行（以及表格标题上显示的“checkAll”复选框）。

我已经通过 JavaScript 完成了这项工作，它在视觉上很有效。但是，在提交表单时，似乎未提交“已检查”值。如果我单击复选框两次（取消选中并再次选中它），它可以工作。

JSF：

<p:dataTable var="invoiceGroup"
             selection="#{chargeBean.selectedInvoiceGroupBeans}"
             value="#{chargeBean.invoiceGroupList}"
             rowKey="#{invoiceGroup.id}">
    <p:column selectionMode="multiple" />
    ...
</p:dataTable>

Javascript 代码：

function selectTableElements() {
    var checkBoxes = $('#invoiceGroupTable td.ui-selection-column input[type="checkbox"]');
    var paginatorPages = $('#invoiceGroupTable .ui-paginator .ui-paginator-pages .ui-paginator-page'); 
    if (checkBoxes.length === 1 && paginatorPages.length === 1) {
        setTimeout(function () {
            $('#invoiceGroupTable th input[type="checkbox"]').click();
        }, 10);
    }
}

有没有办法在服务器端做这个？

Answer 1

首先，我更喜欢多选数据表without checkboxes（只需使用CTRL键http://www.primefaces.org/showcase-labs/ui/datatableRowSelectionMultiple.jsf进行多选）。

其次，如果列表（invoiceGroupList）只有一个成员/对象并将其自动添加到第二个列表selectedInvoiceGroupBeans，我不知道您为什么不检查（在服务器端）。如果您仍然希望这也是视觉上的，您可以保留已经完成工作的 javascript/jquery 函数。您还可以查看Primefaces RequestContext 组件：如果您想要一些更有趣的视觉设计，例如在运行操作方法后选择甚至突出显示该行 - http://www.primefaces.org/showcase-labs/ui/requestContext.jsf，您可以从服务器端调用 javascript 函数.

第三，你为什么使用setTimeout javascript函数？如果您推送执行提交的commandButton 并在单击时调用您的 javascript 函数，则该按钮将首先执行提交，然后您的复选框选中，这样做您将不会获得预期的行为。