How to customize context menu for different types of nodes in jstree?

I am using the contextmenu and type plugin for jstree and want to define different contextmenu according to "types", for example:

    "plugins" : [ "themes", "json_data", "ui", "contextmenu", "types" ],
    "themes" : {
        "url" : "css/jstree/themes/classic/style.css",
        "theme" : "classic",
        "icons" : false
    "json_data" : { "data" : data },
    "types": {
        "types": {
            "leaf": { "contextmenu" : { items : contextMenu } }


but it doesn't work, it displays the same context menu for all nodes, but not specified the way I defined for "leaf" nodes. Is it because it cannot define the contextmenu on the type? Then how easy it is to do it.


source to share

1 answer

You have to define the context menu in the plugin section of the context menu. I think the best way at the moment is to define all elements for all nodes and then remove the elements according to the node type, or even better - define a function that returns the context menu according to the node. those. you usually define a context menu without a function:

    "contextmenu" : {
        items: {
            "some_action" : {
                "label" : "Do something",
                "action"            : function (obj) { this.do_action(obj); },
                "_disabled"         : function (obj) { 
                    // here you can decide if you want to show the item but disable it
            // define more items
         if (data.rslt.o.attr("rel") == "no_action") {
            delete items.some_action;
    return items;




All Articles