jsTree和上下文菜单：修改项目 [英] jsTree and Context Menu: modify items

问题描述

我正在使用 jsTree 3.0.0 ，我需要通过以下方式之一修改上下文：

I'm using jsTree 3.0.0 and I need to modify the context in one of the following ways:

• 更改默认项目的标签语言，禁用一些默认项目并添加新项目。


• 重写所有项目并绑定到创建的一些新项目，重命名和删除功能。

我尝试了几种方法但没有任何效果。例如，这返回 Uncaught TypeError：当我点击create时，Object [object global]没有方法'create'。

I tried several approaches but nothing worked. For example, this returns Uncaught TypeError: Object [object global] has no method 'create' when I click on create.

"contextmenu":{
    "items": function($node) {
        return {
            createItem : {
                 "label" : "Create New Branch",
                 "action" : function(obj) { this.create(obj); alert(obj.text())},
                 "_class" : "class"
            },
            renameItem : {
                 "label" : "Rename Branch",
                 "action" : function(obj) { this.rename(obj);}
            },
            deleteItem : {
                 "label" : "Remove Branch",
                 "action" : function(obj) { this.remove(obj); }
            }
        };
    }
},

如果我尝试添加一个项目，如下一个示例，我松开了默认菜单项：

If I try to add one item as in the next example, I loose the default menu items:

items : { 
    "create_folder" : {
        "separator_before" : false,
        "separator_after" : false,
        "label" : "Create Folder",
        "action" : function (obj) { alert(1); /* this is the tree, obj is the node */ }
    }
}

我哪里错了？

推荐答案

已解决：

"contextmenu":{         
    "items": function($node) {
        var tree = $("#tree").jstree(true);
        return {
            "Create": {
                "separator_before": false,
                "separator_after": false,
                "label": "Create",
                "action": function (obj) { 
                    $node = tree.create_node($node);
                    tree.edit($node);
                }
            },
            "Rename": {
                "separator_before": false,
                "separator_after": false,
                "label": "Rename",
                "action": function (obj) { 
                    tree.edit($node);
                }
            },                         
            "Remove": {
                "separator_before": false,
                "separator_after": false,
                "label": "Remove",
                "action": function (obj) { 
                    tree.delete_node($node);
                }
            }
        };
    }
}

这篇关于jsTree和上下文菜单：修改项目的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！