Create Functionality in Context Menu of jsTree not working

Question

New nodes won't be created when 'types' plugin is defined.

Please look at this fiddle. I'm unable to create new Nodes in the tree. http://jsfiddle.net/z8L5r9w3/1/

$('#jstree').jstree({
"core" : {
    "check_callback" : true,
    "data" : [
        { "text" : "Branch 1", "type" : "branch", "children" : [
            { "text" : "leaf 1.1", "type" : "leaf" },
            { "text" : "leaf 1.2", "type" : "leaf" },
            { "text" : "leaf 1.3", "type" : "leaf" }
           ]
        },
        { "text" : "Branch 2", "type" : "branch", "children" : [
            { "text" : "leaf 2.1", "type" : "leaf" },
            { "text" : "leaf 2.2", "type" : "leaf" },
            { "text" : "leaf 2.3", "type" : "leaf" }
           ]
        }
    ]
},
        "types" : {
            "#" : {
                "valid_children" : ["branch"]
            },
            "branch" : {
                "valid_children" : ["leaf"]
            },
            "leaf" : {
                "valid_children" : []
            }
        },
"plugins" : ["types", "dnd", "contextmenu"]});

Answer 1

Also, you can override "contextmenu"

    "contextmenu":{
                "items": function () {
                    return {
                        "Create": {
                            "label": "Create",
                            "action": function (data) {
                                var ref = $.jstree.reference(data.reference);
                                sel = ref.get_selected();
                                if(!sel.length) { return false; }
                                sel = sel[0];
                                type = ref.get_type(sel);
                                if (type == "#")
                                    type = "branch";
                                else if (type == "branch")
                                    type = "leaf";
                                else if (type == "leaf")
                                    type = "";
                                sel = ref.create_node(sel, {text: "new "+type, type: type});
                                if(sel) {
                                    ref.edit(sel);
                                }

                            }
                        },
                        "Rename": {
                            "label": "Rename",
                            "action": function (data) {
                                var inst = $.jstree.reference(data.reference);
                                obj = inst.get_node(data.reference);
                                inst.edit(obj);
                            }
                        },
                        "Delete": {
                            "label": "Delete",
                            "action": function (data) {
                                var ref = $.jstree.reference(data.reference),
                                sel = ref.get_selected();
                                if(!sel.length) { return false; }
                                ref.delete_node(sel);

                            }
                        }
                    };
                }
            },