如何用JSF中的javascript选择p：selectOneRadio中的所有f：selectItems？

Question

我的jsf代码如下：

  <p:selectOneRadio id="options" value="#{obj.idcStatus}">
    <f:selectItem itemLabel="Approve" itemValue="#{true}" />
    <f:selectItem itemLabel="Disapprove" itemValue="#{false}" />
  </p:selectOneRadio>

我想添加一个selectOneRadio，它可以从selectOneRadio（id="options"）中选择所有项目，如下所示：

如何使这项工作？

感谢。

Answer 1

为这些单选按钮添加一个独特的样式类，例如styleClass="status"。

<p:selectOneRadio id="all">
    <f:selectItem itemLabel="Approve all" itemValue="#{true}" />
    <f:selectItem itemLabel="Disapprove all" itemValue="#{false}" />
</p:selectOneRadio>

<p:dataTable id="table" value="#{bean.items}" var="item">
    <p:column>#{item.value}</p:column>
    <p:column>
        <p:selectOneRadio id="status" value="#{item.status}" styleClass="status">
            <f:selectItem itemLabel="Approve" itemValue="#{true}" />
            <f:selectItem itemLabel="Disapprove" itemValue="#{false}" />
        </p:selectOneRadio>
    </p:column>
</p:dataTable>

一旦完成，那么有两种通用方法来实现功能要求：

1. 客户端，使用jQuery：

   <p:selectOneRadio id="all" onchange="$('.status .ui-radiobutton:has([value=' + this.value + ']) .ui-radiobutton-box').click()">
       ...
   </p:selectOneRadio>
   

2. 服务器端，使用JSF ajax：

   <p:selectOneRadio id="all">
       ...
       <p:ajax listener="#{bean.updateStatus(component.value)}" update="@(.status)" />
   </p:selectOneRadio>
   

   使用这种新bean方法：

   public void updateStatus(boolean newStatus) {
       for (Item item : items) {
           item.setStatus(newStatus);
       }
   }