如何在PrimeFaces ContextMenu结果中使用来自目标div的数据属性作为视图

Question

我正在尝试执行以下操作：

• 来自简单的元素收藏...
• 添加一个PrimeFaces ContextMenu ...
• 将第一个菜单选项转发到新页面...
• 将数据属性从所选元素传递为视图参数

一切似乎都很简单，直到我走到最后一步，我似乎找不到一种使它工作的方法。

，例如

  <div class="group" data-group="GRP1">
    ...
  </div>
  <div class="group" data-group="GRP2">
    ...
  </div>
  <div class="group" data-group="GRP3">
    ...
  </div>
  <p:contextMenu targetFilter="div.group">
    <p:menuitem value="Edit" outcome="group.xhtml?group=GRP???"/>
  </p:contextMenu>

DIV是生成HTML的，我真的没有太多控制这些，因此可能需要在客户端使用JavaScript做某事。

我试图从JavaScript端抓住该组，但是我看不到如何将功能绑定到Borforeshow处理程序。我可以看到，如果我可以注册正确的事件处理程序，那么PF代码将使我通过事件（我可以从中获得目标元素和数据属性）：

  // from PF menu.js
  if(this.cfg.beforeShow) {
      var retVal = this.cfg.beforeShow.call(this, e);
      if(retVal === false) {
        return;
      }
  }

但我不确定如何访问 - 如果我只使用内联事件注册，那么我只能通过JavaScript代码而不是对我的功能的引用：

  function doBeforeShow(menu, event) {
    var group = event.target.dataset['group'];
  }
  <p:contextMenu targetFilter="div.group" beforeShow="/* this is just executed JS not a bound function */">

无论如何，即使我可以从JS一侧获得小组，我也不确定我会做什么...可能将其存放在某个地方，并将另一个处理程序附加到P：menuitem，所以当它是何时选择它可以在调用结果之前修改结果？

所以我被卡住了！任何人都对我如何工作有任何想法？

谢谢，

Answer 1

使此工作有效，尽管不确定这是最好的方法...

需要在PrimeFaces上进行补丁，以将jQuery事件存储在菜单窗口上：

--- src/main/resources/META-INF/resources/primefaces/menu/menu.js       (revision 12491)
+++ src/main/resources/META-INF/resources/primefaces/menu/menu.js       (working copy)
@@ -1109,6 +1109,9 @@
             top = top - height;
         }
+        // save the event which activated this menu
+        this.jqEvent = e;
+        
         if(this.cfg.beforeShow) {
             var retVal = this.cfg.beforeShow.call(this, e);
             if(retVal === false) {

然后，将" widgetvar"添加到ContextMenu中以命名菜单窗口小部件和一些客户端JavaScript，以在激活链接之前更新该链接：

  <p:contextMenu targetFilter="div.group" widgetVar="ctxMenu">
    <p:menuitem value="Edit" onclick="fixGroupLink(PF('ctxMenu'), this);"
        outcome="group.xhtml?group=GRP???"/>
  </p:contextMenu>
  function fixGroupLink(menu, menuitem) {
    var grp = menu.jqEvent.target.dataset.group;
    menuitem.href = menuitem.href.replace(/group=.*$/, "group=" + grp);
  }

所以这有效，我现在将其标记为现在接受的，但是如果任何人有一个更好的解决方案，尤其是一个不包括定制PrimeFaces库的方法，任何人都很高兴。