6

我有一个 PrimeFaces (3.5) DataTable,其中包含一些列,<p:cellEditor>其中的多行选择由selectionMode="multiple".

当我单击包含 <p:cellEditor>的行中的单元格时,只会不时选择该行。仅当单击靠近单元格边框的填充区域时,才能选择行。当单击中间单元格的实际文本时,不进行选择,该单元格实际上由<p:cellEditor>.

这不会发生,当<p:cellEditor>被解雇时。

在我的情况下,以这种方式选择一行是必不可少的,因为通过右键单击要删除的行来使用上下文菜单删除与展示示例完全相同的行(该示例工作正常,因为它没有有<p:cellEditor>。我没有找到同时使用行选择和单元格编辑器的展示示例)。

已报告此问题,其状态为“WontFix”。他们说,

不支持同时选择单元格和行。

但是从 3.5 降级框架确实有效(因此,上面的引用应该是错误的,并且似乎被误解了)但这不是一个解决方案。有人遇到过这个问题吗?有没有办法改变这种行为?

4

2 回答 2

2

嗯,已经4年了,还没有修复。但是 - 你可以使用一些 JS 魔法来让它工作。

首先定义按索引选择数据表行的JS函数:

<script>
function selectCurrentRow(index) {
  var table = PF('myTableWidgetVar');
  table.unselectAllRows();
  table.selectRow(index, false);
}
</script>

然后使用 rowIndexVar 属性集定义您的数据表:

 <p:dataTable id="myTable" widgetVar="myTableWidgetVar" var="parameter"
              value="#{serviceMB.parameters}"
              rowIndexVar="rowIndex"
              rowKey="#{parameter.id}"
              selectionMode="single"
              editMode="cell">

并在定义了 onclick 函数的 div 中包装 cellEditor 字段:

 <p:column>
     <p:cellEditor>
         <f:facet name="output">
             <div onclick="selectCurrentRow(#{rowIndex});">
               <p:outputLabel value="#{parameter.value}"/>
             </div>
         </f:facet>
         <f:facet name="input">
             <div onclick="selectCurrentRow(#{rowIndex});">
               <p:inputText value="#{parameter.value}"/>
             </div>
         </f:facet>
     </p:cellEditor>
 </p:column>

如果您使用行分组数据表(行索引将被移动),此 hack 将无法正常工作。

编辑:

如果您使用行分组数据表,请使用此函数:

function selectByRowKey(rowKey, table) {
    for (var i = 0; i &lt; table.rows.length; i++) {
        var row = table.rows.get(i);
        if (row.getAttribute("data-rk") === rowKey) {
            table.unselectAllRows();
            table.selectRow(i, false);
            break;
        }
    }
}

其中 table = PF('myTableWidgetVar') 和 rowKey 是当前选择的 rowKey(例如 '#{parameter.id}')。

于 2018-03-01T11:54:01.360 回答
1

USE: style="display: block" 在你的 cell:Editor 中,对我有用。

<p:cellEditor>
        <f:facet name="output"><h:outputText style="display: block;" value="#{whatever}"/></f:facet>
        <f:facet name="input"><p:inputText id=......../></f:facet>
</p:cellEditor>
于 2019-01-14T13:12:27.977 回答