デビッドの応答はうまく、効率的だと思われます。a_attr属性を使用してさまざまなノードを区別し、それに基づいてさまざまなコンテキストメニューを生成できる、ソリューションの別のバリエーションを見つけました。
以下の例では、FolderとFilesの2種類のノードを使用しました。私もグリフィコンを使って別のアイコンを使いました。ファイルタイプノードの場合、名前を変更して削除するコンテキストメニューのみを取得できます。フォルダには、ファイルの作成、フォルダの作成、名前の変更、削除など、すべてのオプションがあります。
完全なコードスニペットについては、https://everyething.com/Example-of-jsTree-with-different-context-menu-for-different-node-typeを参照してください。
$('#SimpleJSTree').jstree({
"core": {
"check_callback": true,
'data': jsondata
},
"plugins": ["contextmenu"],
"contextmenu": {
"items": function ($node) {
var tree = $("#SimpleJSTree").jstree(true);
if($node.a_attr.type === 'file')
return getFileContextMenu($node, tree);
else
return getFolderContextMenu($node, tree);
}
}
});
初期のjsonデータは次のとおりです。ノードタイプはa_attr内に記載されています。
var jsondata = [
{ "id": "ajson1", "parent": "#", "text": "Simple root node", icon: 'glyphicon glyphicon-folder-open', "a_attr": {type:'folder'} },
{ "id": "ajson2", "parent": "#", "text": "Root node 2", icon: 'glyphicon glyphicon-folder-open', "a_attr": {type:'folder'} },
{ "id": "ajson3", "parent": "ajson2", "text": "Child 1", icon: 'glyphicon glyphicon-folder-open', "a_attr": {type:'folder'} },
{ "id": "ajson4", "parent": "ajson2", "text": "Child 2", icon: 'glyphicon glyphicon-folder-open', "a_attr": {type:'folder'} },
];
ファイルとフォルダを作成するためのcontectメニュー項目の一部として、ファイルアクションとして以下の同様のコードを使用します。
action: function (obj) {
$node = tree.create_node($node, { text: 'New File', icon: 'glyphicon glyphicon-file', a_attr:{type:'file'} });
tree.deselect_all();
tree.select_node($node);
}
フォルダアクションとして:
action: function (obj) {
$node = tree.create_node($node, { text: 'New Folder', icon:'glyphicon glyphicon-folder-open', a_attr:{type:'folder'} });
tree.deselect_all();
tree.select_node($node);
}