p:dataTable - 通过 menuButton 切换 rowEdit答案

【问题标题】：p:dataTable - toggle rowEdit via menuButtonp:dataTable - 通过 menuButton 切换 rowEdit
【发布时间】：2014-09-09 21:55:25
【问题描述】：

我有一个p:dataTable，其中最后一列包含一个p:menuButton，为相应的行提供一些选项，例如“删除”和“编辑”（还有更多，这就是我想合并的原因这些选项在一个列中）。

如何使用 menuItem ('edit') 切换表格的行编辑器，以便行为与单击 p:rowEditor-icon 相同（我根本不渲染） .

代码sn-p：

<p:datatable ... >
  ...
  <p:column>
    <p:menuButton>
      ...
      <p:menuItem value="Edit" onclick="[what to put here?]"/>
    </p:menuButton>
  </p:column>
</p:datatable>

【问题讨论】：

标签： jquery jsf primefaces datatable

【解决方案1】：

您也许可以直接为小部件调用 PrimeFaces javascript，但有一个更简单的解决方案。只需将您的额外功能附加到包含 p:rowEditor 标记的列即可。

例如，下面是如何在行编辑图标后附加删除链接命令：

<p:dataTable var="record" ... >
 ...
 <p:column>
  <p:rowEditor />
  <p:cellEditor>
   <f:facet name="output">
     <p:commandLink id="deleteLink" action="#{editBean.delete(record)}">Delete</p:commandLink>
   </f:facet>
   <f:facet name="input">
    <div></div>
   </f:facet>
  </p:cellEditor>
 </p:column>
</p:dataTable>

【讨论】：

为每个额外功能附加按钮对我来说不是一个选项（请参阅问题）。我的方法是将所有功能组合在一个组件中（p:menuButton）。因此，对不起，您回答的第二部分对我没有帮助。更有趣的是如何我可以直接调用PF JS？？
在这种情况下，您必须打开 primefaces javascript 文件并找出它们的接口。然后，您可以编写自己的脚本来访问数据表 jquery 小部件，使用 PF() 函数手动执行相同的功能。（看看 PrimeFaces.widget.DataTable.bindEditEvents javascript 函数——你会看到它们如何将点击事件绑定到图标。）我一直以这种方式扩展 primefaces 功能，但在升级版本时要小心因为他们的实现可能会改变和破坏你的代码。