javascript - 在上下文菜单 PrimeFaces 中右键单击后获取值

Question

我在右键单击后在我的项目上下文菜单中创建了。菜单模型是用 Java 创建的。在 XHTML 中我只有:

<p:panelMenu style="width:250px" id="menu"
            model="#{menuBean.menuModel}" stateful="false">
        </p:panelMenu>

<p:contextMenu id="context" for="menu"
                model="#{menuBean.contextMenuModel}" style="width:300px"> 

我想在单击鼠标右键时从项目中获取值或 ID。 在 PrimeFaces 中如何做到这一点？我只找到了使用数据表的答案。我在项目中使用了 JSF 和 PrimeFaces。

编辑: 我像这样写了简单的 jQuery:

$(".ui-menuitem-link").contextmenu(function() {
   document.getElementById("hiddenField").value = $(this).text();
});

它返回所选项目的名称，但也许有人在没有 jQuery 的情况下有更好的解决方案。

Answer 1

p:contextMenu 有一个 beforeShow 属性，可用于触发客户端 javascript 函数(可在文档中阅读)。

它还有一个 targetFilter，只触发“for”中的某些元素。如果你给你的表单一个明确的 id(例如 myForm)，你可以让它只在菜单项链接上触发:

<p:contextMenu for="menu" targetFilter="#myForm\\:menu .ui-menuitem-link" beforeShow="...">

例如，您可以执行 console.log(this) 或 console.log(event) 并从中检查您需要和有权访问的内容，数量很多。

contextMenu 上下文中的'this' 有一个 jqTarget 属性，它将为您提供 contextMenu 被触发的 html 组件(菜单)，但您也可以使用具有特定菜单目标的事件对象项目。

<p:contextMenu for="menu" targetFilter="#myForm\\:menu .ui-menuitem-link" beforeShow="console.log(this); console.log(event)">

会给你这样的输出

Object { _super: undefined, cfg: Object, id: "myForm:j_idt118", jqId: "#myForm\:j_idt118", jq: Object, widgetVar: "widget_myForm_j_idt118", keyboardTarget: Object, links: Object, rootLinks: Object, jqTargetId: "#myForm\:menu", 1 meer… }  panelMenu.xhtml:655:174
Object { originalEvent: contextmenu, type: "contextmenu", isDefaultPrevented: returnFalse(), target: <a.ui-menuitem-link.ui-corner-all.ui-state-hover>, currentTarget: <div#myForm:menu.ui-panelmenu.ui-widget>, relatedTarget: null, timeStamp: 103942249, jQuery31004030775514688282: true, delegateTarget: HTMLDocument → panelMenu.xhtml, handleObj: Object, 1 meer… }

所以你确实需要 javascript 来获得你需要的真正值(value)，你只是不需要自定义 jquery。

由于我不知道您的隐藏字段在哪里，因此我无法将其纳入我的回答中。对不起