Ranjith Venkatesh
Ranjith Venkatesh

Reputation: 1362

Tweaking contextmenu in jstree

I would like to do the following with the contextmenu plugin: - Rename "Create" as "Add" - Remove "Edit"

How does one do it?

I do NOT want to create a custom menu because then I only get a node and not the nice data object that can be used in the Create, Rename and Delete events.

Upvotes: 2

Views: 470

Answers (1)

Ranjith Venkatesh
Ranjith Venkatesh

Reputation: 1362

Found the answer in the code of jstree itself: Added this to the jstree code:

    "contextmenu": {
        items: customContextMenu
    }

And this for the context menu items:

function customContextMenu() {

    'use strict';

    var items = {
            "create" : {
                "separator_before": false,
                "separator_after": true,
                "_disabled": false, //(this.check("create_node", data.reference, {}, "last")),
                "label": "Add",
                "action": function (data) {
                    var inst = $.jstree.reference(data.reference),
                        obj = inst.get_node(data.reference);
                    inst.create_node(obj, {}, "last", function (new_node) {
                        setTimeout(function () { inst.edit(new_node); }, 0);
                    });
                }
            },
            "rename" : {
                "separator_before": false,
                "separator_after": false,
                "_disabled": false, //(this.check("rename_node", data.reference, this.get_parent(data.reference), "")),
                "label": "Rename",
                "action": function (data) {
                    var inst = $.jstree.reference(data.reference),
                        obj = inst.get_node(data.reference);
                    inst.edit(obj);
                }
            },
            "remove" : {
                "separator_before": false,
                "icon": false,
                "separator_after": false,
                "_disabled": false, //(this.check("delete_node", data.reference, this.get_parent(data.reference), "")),
                "label": "Withdraw",
                "action": function (data) {
                    var inst = $.jstree.reference(data.reference),
                        obj = inst.get_node(data.reference);
                    if (inst.is_selected(obj)) {
                        inst.delete_node(inst.get_selected());
                    } else {
                        inst.delete_node(obj);
                    }
                }
            }
        };

    return items;
}

Upvotes: 2

Related Questions