在p:tree上应该使用什么事件来选择树节点并具有上下文菜单? [英] What event should be used on a p:tree to select a tree node and have a context menu?
问题描述
我正在使用上下文菜单创建PrimeFaces(5.3)树.选定的节点应存储在#{myBean.selectedNode}中.当我使用鼠标左键选择一个节点时，将设置正确的节点.但是，当我尝试从上下文菜单中对节点执行操作时，没有先选择它，则未设置正确的节点(未调用bean中的setter).
I'm creating a PrimeFaces (5.3) tree with a context menu. Selected nodes should be stored in #{myBean.selectedNode}. When I select a node using the left mouse button the correct node is set. But, when I try to run an action on a node from a context menu, without selecting it first, the correct node isn't set (the setter in my bean is not called).
我正在遵循PrimeFaces展示柜中的示例.如您所见，在PrimeFaces展示柜中，您可以立即右键单击一个节点，然后单击查看"，并且咆哮声将显示正确的节点.
I'm following the example in the PrimeFaces showcase. As you can see, in the PrimeFaces showcase you are able to immediately right click a node, click "View", and the growl will display the correct node.
这是我的设置:
它是ViewScoped，并且有一个private TreeNode selectedNode带有getter和setter.
It is ViewScoped and there is a private TreeNode selectedNode with getter and setter.
以下是有趣的部分:
public void onNodeSelect(NodeSelectEvent event) {
MyTreeNode myTreeNode = (MyTreeNode) event.getTreeNode();
myController.setSelected(myTreeNode.getEntity());
}
public void addChild(String name) {
MyTreeNode myTreeNode = (MyTreeNode) selectedNode;
MyTreeNode childNode = myTreeNode.addChild(name);
myController.setSelected(childNode.getEntity());
myController.insert();
}
XHTML
<h:form id="mainForm">
<p:tree value="#{myBean.root}" var="node"
id="myTree" dynamic="true"
selectionMode="single" selection="#{myBean.selectedNode}">
<p:treeNode expandedIcon="ui-icon-folder-open" collapsedIcon="ui-icon-folder-collapsed"
type="myType">
<h:outputText value="#{node}"/>
</p:treeNode>
<p:ajax event="select" listener="#{myBean.onNodeSelect}" />
</p:tree>
<p:contextMenu for="myTree">
<p:menuitem action="#{myBean.addChild('new')}"
value="Add"
process="@this"
update=":mainForm:myTree"/>
</p:contextMenu>
</h:form>
我能够通过替换JavaScript中的PrimeFaces.widget.BaseTree.nodeRightClick函数来解决此问题，以便在右键单击时触发fireNodeSelectEvent.
I was able to solve this problem by replacing the PrimeFaces.widget.BaseTree.nodeRightClick function in JavaScript in order to trigger the fireNodeSelectEvent on right click.
PrimeFaces.widget.BaseTree.prototype.nodeRightClick = function(e, a) {
PrimeFaces.clearSelection();
if ($(e.target).is(":not(.ui-tree-toggler)")) {
var d = a.parent(), b = a.hasClass("ui-tree-selectable");
if (b && this.cfg.selectionMode) {
var c = this.isNodeSelected(d);
if (!c) {
if (this.isCheckboxSelection()) {
this.toggleCheckboxNode(d)
} else {
this.unselectAllNodes();
// Fixed right click selecting
// original code: this.selectNode(d, true)
this.selectNode(d); // <-- Fix
}
}
this.fireContextMenuEvent(d)
}
}
}
对我来说，这似乎是个错误，因此我在GitHub上创建了 issue .此问题已关闭，并显示为无法解决"，并带有注释请使用contextMenu事件".
This seemed like a bug to me, so I created an issue on GitHub. This issues was closed as "won't fix" with the comment "Please use contextMenu event".
我已经两次检查了文档的tree和contextMenu部分.什么事件应该在哪里使用?我在GitHub上提出了相同的问题，但没有任何回应
I've checked the tree and contextMenu section of the documentation twice. What event should be used where? I've asked the same question at GitHub, but there was no response.
推荐答案
阅读您报告的问题，我调查了代码(已打开).似乎p:tree有一些未记录的事件，contextMenu是其中一个(dragdrop是另一个).
Reading the issue you reported, I investigated the code (it is open). It seems that p:tree has some undocumented events, contextMenu being one of them (dragdrop being the other).
The 5.3 java-source and 5.3 javascript-source contains references to a contextMenu event, so
<p:ajax event="contextMenu" listener="#{myBean.onContextMenu}" />
和
public void onContextMenu(NodeSelectEvent event) {
MyTreeNode myTreeNode = (MyTreeNode) event.getTreeNode();
myController.setSelected(myTreeNode.getEntity());
}
将起作用.请注意，没有ContextMenuEvent，但是它接受/需要NodeSelectEvent
will work. Notice that there is no ContextMenuEvent but that it accepts/needs a NodeSelectEvent
这篇关于在p:tree上应该使用什么事件来选择树节点并具有上下文菜单?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
