3

我们正在使用 jsTree（2011 年 9 月 2 日的第 236 版）。

有谁知道是否有任何方法可以访问在与“动作”相关的功能中选择的菜单项名称？

我想自动化菜单项的定义，以便根据上下文菜单中项目的标识符设置每个“动作”的功能。

例如，对于具有三个操作（“A”、“B”或“C”）的上下文菜单

...
var items = {};             
for(var i=0; i < preconfiguredItemsData.length; i++) 
{ 
    var item = preconfiguredItemsData[i]; 

    items[item.name] = {
        "label": item.title,
        "action": function (liNode) {
            control = eval("new " + **SELECTED ITEM IDENTIFIER ?** + "()"); 
                    // **new A(), new B() or new C()** depending on the selected
                    // item on the context menu.
                    // I have the identifier of the jsTree node but ... how
                    // can I get the item id ("A", "B" or "C")?
            control.execute(); 
        },              
        "_class": "class",  
        "separator_before": false,
        "separator_after": true,
        "icon": false,
        "submenu": {}
    };
    ...
} //for

items.create = false; 
items.rename = false; 
items.remove = false,
items.edit = false;
items.ccp = false;

...

我希望已经清楚地描述了我的问题。

提前致谢。

4

3 回答 3

3

我正在使用 jsTree 3.0.2，这个修复对我不起作用。

“i”参数已经包含在发送到“action”函数的结果中，但它只包含有关单击的上下文菜单的详细信息，而不是绑定到该 jsTree 分支的 JSON 项。

在此处输入图像描述

要获取右键单击的项目的 id，这就是我所做的。

我的树中的一些分支是文件夹，一些是报告（用户可以运行），所以我需要能够调整我的 jsTree 上下文菜单，具体取决于用户右键单击的节点类型，以及报告，我需要获取所选记录的 ID。

在此处输入图像描述

首先，我编写了一个小getCustomMenu函数来获取特定 jsTree 分支的上下文菜单项，因此，我将其定义jstree如下。

$('#divReportsTree').jstree({
   "core": {
       'data': JSON.Results.core.data
   },
   "plugins": ["contextmenu"],
   "contextmenu" : {
       //  Call a function, to fetch the CustomMenu for this particular jsTree branch
       items: getCustomMenu    
   }, 
})

我的getCustomMenu功能看起来像这样：

function getCustomMenu(node) {

    var thisReportID = node.li_attr.ReportID;

    var items = {
      Run: {
        "separator_before": false,
        "separator_after": true,
        "label": "Run this report",
        "icon": "/Images/Icons/Go.png",
        "action": function (node, reportID) {
             //  Call a function to run a report, with a particular Report ID 
             RunReport(node, thisReportID);
        }
      },
      Refresh: {
        "separator_before": false,
        "separator_after": false,
        "label": "Refresh",
        "icon": "/Images/Icons/Refresh.png",
        "action": function (node, reportID) {
             //  Call a refresh function, with a particular Report ID 
             RefreshReport(node, thisReportID);
        }
    };

    //  If this is a jsTree node for a Folder (rather than a Report) then 
    //  just show the "Refresh" ContextMenu item
    if (node.li_attr.ReportID == null)
    {
        delete items.Run;
    }

    return items;
}

当用户右键单击 my 中的报告时jstree，该函数将使用所选报告的 IDgetCustomMenu调用 my函数。RunReport

在此处输入图像描述

关键是填充这棵树的 JSON 数据专门ReportID在 jsTree 的属性中添加了一个li_attr属性。

在此处输入图像描述

因为我们getCustomMenu调用了动作函数（在这个例子中是“RunReport”），我们可以调整它来传递额外的参数给这个函数。

呸。

希望所有这些都有帮助（并且有意义！）

于 2014-08-04T09:10:29.497 回答
1

有更简单的解决方案，不需要修改 jstree 的源代码。我用jstree 3.3.1测试了这种方法。

从文档（强调我的）：

激活菜单项后，将使用包含以下键的对象调用操作函数：item - 上下文菜单项定义，如下所示，reference - 使用的 DOM 节点（树节点）， element - 上下文菜单 DOM 元素, position - 具有 x/y 属性的对象，指示菜单的位置。

该item属性是上下文菜单项的完整定义。这意味着您可以将任何属性附加到该对象，并稍后检索其值。在问题示例中，这可能是_class属性。目前尚不清楚 OP 是否尝试过这种方法。

var items = {
  item1: {
    label: 'a label',
    icon: 'fa fa-font-awesome',
    separator_after: true,
    disabled: false,
    action: lang.hitch(this, 'doSomething'),
    _name: 'item1'
  }
}

然后，_name 将在item属性中传递。

doSomething: function (obj) {
  console.log(obj.item._name)
}
于 2016-08-05T17:17:30.657 回答
0

通过在原jquery.jstree.js的这个函数调用中加入函数名作为参数解决。

(function ($) {
    $.vakata.context = {
            .....
            exec : function (i) {
                ....
                if($.isFunction($.vakata.context.func[i])) {
                    ....
                    $.vakata.context.func[i].call($.vakata.context.data, $.vakata.context.par, i);    //Param 'i' added        
                    ....
                }
                ....
            }
            ....
        }

谢谢！

于 2012-05-08T09:17:38.277 回答