jsTree and Context Menu: modify items
contextmenu, javascript, jquery, jstree
Solution
Resolved:
"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);
}
}
};
}
}
Problem
I'm using `jsTree 3.0.0` and I need to modify the context in one of the following ways: - Change label language for the default items, disable some default items and add new items. - Rewrite all items and bind to some new items the create, rename and delete function. 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 */ } } } ``` Where am I wrong?