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"]});
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);
}
}
};
}
},