如何使用JavaScript在p:treeTable上触发行编辑器

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何使用JavaScript在p:treeTable上触发行编辑器相关的知识,希望对你有一定的参考价值。

我有一个editable p:treeTable

<p:treeTable ...
             editable="true">
  <p:column headerText="Name">
    <p:cellEditor>
      ...
    </p:cellEditor>
  </p:column>
  <p:column style="width:32px">
    <p:rowEditor />
  </p:column>
</p:treeTable>

我不喜欢我必须单击铅笔图标来触发行编辑器的事实。我尝试通过在浏览器的javascript控制台的第一行选择第一个铅笔的锚来触发编辑器:

document.querySelectorAll(".ui-row-editor-pencil")[0].click();

这不起作用。还有其他方法可以使用JavaScript触发行编辑器吗?

答案

显然你不需要选择并点击铅笔的锚点,但锚点内的span,所以:

document.querySelectorAll(".ui-row-editor-pencil span")[0].click();

我添加了一个hack来触发基于行键的行编辑,通过在styleClassp:rowEditor属性中添加行键:

<p:treeTable nodeVar="node" ...>
  ...
  <p:column style="width:32px">
    <p:rowEditor styleClass="rowKey-#{node.rowKey}"/>
  </p:column>
</p:treeTable>

这允许您通过ID轻松触发编辑:

document.querySelector(".rowKey-"+ rowKey +" .ui-row-editor-pencil span").click();

也可以看看:

以上是关于如何使用JavaScript在p:treeTable上触发行编辑器的主要内容,如果未能解决你的问题,请参考以下文章

jquery插件treetable使用

jQuery.treetable使用及异步加载

jquery treeTable插件使用细则

在 TreeTable 绑定上添加动态过滤器

PrimennGTreeTable 图标不可见

实现layui的树形表格treeTable