Question

基于primefaces文档：

使用命令组件进行单选此方法使用命令组件（如commandLink或）实现命令按钮。通过作为参数传递，可以将所选行设置为服务器端实例正在使用EL 2.2或使用f:setPropertyActionListener。

<p:dataTable var="car" value="#{carBean.cars}">
    <p:column>
        <p:commandButton value="Select">
            <f:setPropertyActionListener value="#{car}"
            target="#{carBean.selectedCar}" />
        </p:commandButton>
    </p:column>
    ...columns
</p:dataTable>

当我按下按钮而不直接选择行时，我需要突出显示行

这是我的代码：

<p:dataTable
    rowKey="${xxx.y1}-${xxx.y2}"
    selection="${managedBean.selectedRow}"
    selectionMode="single"
    value="#{managedBean.listOfBeans}" var="xxx">

    <p:column>
        <p:commandButton action="${managedBean.saveSomethingInDB}"
            update="vvvComponent">
            <f:setPropertyActionListener value="#{currentRow}"
                target="#{managedBean.selectedRow}" />
        </p:commandButton>
    </p:column>
</p:dataTable>

Answer 1

我用这种方式解决了它：

<p:dataTable
    rowKey="${xxx.y1}-${xxx.y2}"
    selection="${managedBean.selectedRow}"
    selectionMode="single"
    value="#{managedBean.listOfBeans}" var="xxx">

    <p:column>
        <p:commandButton action="${managedBean.saveSomethingInDB}" onclick="highlightRow(jQuery(this));"
            update="vvvComponent">
            <f:setPropertyActionListener value="#{currentRow}"
                target="#{managedBean.selectedRow}" />
        </p:commandButton>
    </p:column>
</p:dataTable>

function highlightRow(commandButton) {
    $('.ui-state-highlight').removeClass('ui-state-highlight');
    commandButton.closest('table').closest('tr').addClass('ui-state-highlight');
}

Answer 2

您的代码适合我。

由于属性ActionListener，当我按下按钮

时突出显示该行

<f:setPropertyActionListener value="#{currentRow}"
            target="#{managedBean.selectedRow}" />

使用命令组件进行单选时突出显示行

2 个答案: