You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

PrimeFaces 13中带RowEditor的DataTable单选按钮选择失效问题

解决PrimeFaces DataTable单选按钮选择无响应问题

要解决单选按钮点击无状态变化、rowSelect事件不触发的问题,你需要显式添加单选按钮列并正确绑定选择逻辑,具体修改如下:

完整修改后的DataTable代码

<p:dataTable id="exampleDatatable"
             var="item" 
             value="#{bean.itemList}" 
             editable="true"
             rowKey="#{item.id}"
             selectionMode="single"
             selection="#{bean.selectedItem}">

  <p:ajax event="rowEdit" listener="#{bean.onRowEditItem}"/>
  <p:ajax event="rowSelect" listener="#{bean.rowSelectItem}"/>
  
  <!-- 新增单选按钮列 -->
  <p:column headerText="选择">
    <p:selectOneRadio value="#{bean.selectedItem}" layout="spread">
      <f:selectItem itemValue="#{item}" />
      <p:ajax event="change" update="exampleDatatable" listener="#{bean.rowSelectItem}"/>
    </p:selectOneRadio>
  </p:column>

  <p:column headerText="Id">
    <p:cellEditor>
      <f:facet name="output">
        <h:outputText value="#{item.id}"/>
      </f:facet>
      <f:facet name="input">
        <h:outputText value="#{item.id}" style="width:100%"/>
      </f:facet>
    </p:cellEditor>
  </p:column>
</p:dataTable>

关键修改说明

  • 单选按钮列配置:用<p:selectOneRadio>实现单行单选,layout="spread"让单个按钮占满单元格,value="#{bean.selectedItem}"直接绑定选中项,itemValue="#{item}"指定当前行对象为选中值。
  • 事件触发:给单选按钮添加<p:ajax event="change">,既更新表格确保选中状态高亮,又直接调用rowSelectItem方法(也可以保留原rowSelect事件,二者选其一即可)。
  • Bean层注意:确保selectedItem的类型和itemList的元素类型一致,并且提供对应的getter/setter方法。

原代码无效原因

你之前仅设置了selectionMode="single"但未添加单选按钮组件,默认的行点击选择会与RowEditor的编辑功能冲突,导致选择逻辑失效。显式添加单选按钮并绑定选择值后,才能避开冲突,正常触发选择事件。

内容的提问来源于stack exchange,提问作者Joe

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.15 01:52:33