Primefaces数据表在单击时取消选择具有多个选择的行

时间:2016-06-02 21:19:32

标签: jsf primefaces

如何仅使用单击取消选择dataTable primeface上的选定行,就像选择行一样。

这是我目前用于选择和取消选择的代码,但取消选择需要按 Ctrl CMD (在mac上)键。

<p:dataTable
    value="#{adminiClubReconManager.bankMovementsFound}" var="movs"
    style="width:90%;border: 0px;"
    selection="#{adminiClubReconManager.selectedBankMovement}"
    rowKey="#{movs.id}" editable="true" styleClass="rowStyle"
    paginator="true" rowsPerPageTemplate="5,10,15" rows="10"
    selectionMode="mutiple"
    paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}">
    <p:ajax event="rowSelect"
        listener="#{adminiClubReconManager.onBankRowSelect()}"
        update="@form:reconMessages" />
    <p:ajax event="rowUnselect"
        listener="#{adminiClubReconManager.onBankRowUnselect()}"
        update="@form:reconMessages" />
    <p:column
        style="background:transparent;border:0px;text-align:left">
        <c:facet name="header">
            <h:outputText
                value="#{msg['admini.common.movement.recon.number']}" />
        </c:facet>
        <h:outputText value="#{movs.id}"
            style="background:transparent;border:0px" />
    </p:column>
    ...
</p:dataTable>

1 个答案:

答案 0 :(得分:-1)

我们有2种方法可以解决这个问题。

<强>第一

创建commandButton并调用primefaces方法unselectAllRows();

<p:dataTable id="dataTableId" var="p" value="#{myBean.dataModel}" paginator="true" rows="50" paginatorPosition="bottom" emptyMessage="Empty results" rowKey="#{p.attribute}" selection="#{myBean.atributeList}" widgetVar="dataTableWidgetVar">`
   <p:commandButton widgetVar="buttonClear" value="Clear selection" onclick="dataTableWidgetVar.unselectAllRows();"/>
</p:dataTable>

点击后,您取消选择行

<强>第二

通过ajaxEvent调用primefaces方法unselectAllRows();

<p:dataTable id="dataTableId" var="p" value="#{myBean.dataModel}"                                                                                                                     paginator="true" rows="50" paginatorPosition="bottom" emptyMessage="Empty results" rowKey="#{p.attribute}" selection="#{myBean.atributeList}" widgetVar="dataTableWidgetVar">`
    <p:ajax event="page" update="dataTableId" oncomplete="dataTableWidgetVar.unselectAllRows();"/>
 ...
</p:dataTable>

在这种情况下,当您单击另一页时,例如第3页,您选择了第一页的数据,ajax执行方法 UnselectAllRows();而且你清楚你已经选择了。

为了解决这个问题,我在primefaces论坛上找到了这个材料:https://forum.primefaces.org/viewtopic.php?f=3&t=24144