jstree contextmenu创建文件/文件夹功能
我试图让用户创建文件或文件夹。因此,当他们右键单击菜单时,上下文菜单将显示: 创建=> 文件 文件夹
这部分工作正常,问题在于附加到每个上下文菜单的功能。此时单击“文件”或“文件夹”会调用: this.create(obj);
如何指定类型?我尝试过 obj.attr("rel","type","folder"),我尝试过 obj.rslt.rel 和许多其他方法,但我'我只是在黑暗中拍摄,哈哈。我已经阅读了文档,布局很好,但对于解释对象的属性毫无用处。
下面是上下文菜单、类型插件和创建节点的绑定的代码。
fma_jstree = $("#archive")
.bind("before.jstree", function (e, data) {
$("#alog").append(data.func + "<br />");
})
.jstree({
// List of active plugins
"plugins" : [
"themes","json_data","ui","crrm","cookies","dnd","search","types","hotkeys","contextmenu"
//"themes","json_data","ui","crrm","cookies","dnd","search","types","contextmenu"
],
"contextmenu" : {
items : { // Could be a function that should return an object like this one
"create" : {
"separator_before" : false,
"separator_after" : true,
"label" : "Create",
"action" : false,
"submenu" :{
"create_file" : {
"seperator_before" : false,
"seperator_after" : false,
"label" : "File",
action : function (obj) {
this.create(obj);
}
},
"create_folder" : {
"seperator_before" : false,
"seperator_after" : false,
"label" : "Folder",
action : function (obj) { this.create(obj); }
}
}
}
}
},
// Using types - most of the time this is an overkill
// read the docs carefully to decide whether you need types
"types" : {
// I set both options to -2, as I do not need depth and children count checking
// Those two checks may slow jstree a lot, so use only when needed
"max_depth" : -2,
"max_children" : -2,
// I want only `drive` nodes to be root nodes
// This will prevent moving or creating any other type as a root node
"valid_children" : [ "drive" ],
"types" : {
// The default type
"default" : {
// I want this type to have no children (so only leaf nodes)
// In my case - those are files
"valid_children" : "none",
// If we specify an icon for the default type it WILL OVERRIDE the theme icons
"icon" : {
"image" : icon_url + "/file.png"
}
},
// The `folder` type
"folder" : {
// can have files and other folders inside of it, but NOT `drive` nodes
"valid_children" : [ "default", "folder" ],
"icon" : {
"image" : icon_url + "/folder.png"
}
},
// The `drive` nodes
"drive" : {
// can have files and folders inside, but NOT other `drive` nodes
"valid_children" : [ "default", "folder" ],
"icon" : {
"image" : icon_url + "/root.png"
},
// those prevent the functions with the same name to be used on `drive` nodes
// internally the `before` event is used
"start_drag" : false,
"move_node" : false,
"delete_node" : false,
"remove" : false
}
}
},
.bind("create.jstree", function (e, data) {
//if creating a root node
if(!$(data.rslt.parent).attr("id")) var id = 1;
//else get parent
else var id = data.rslt.parent.attr("id").replace("node_","");
$.post(
ajaxurl,
{
"action" : "fma_create_node",
"operation" : "create_node",
"id" : id,
"position" : data.rslt.position,
"title" : data.rslt.name,
"type" : data.rslt.obj.attr("rel")
},
function (r) {
if(r.status) {
$(data.rslt.obj).attr("id", "node_" + r.id);
}
else {
$.jstree.rollback(data.rlbk);
}
},
'json'
);
})
任何帮助将不胜感激;) 问候, 戴蒂
I'm trying to let the user create either a file or a folder. So when they right click on the menu the context menu will show:
create =>
file
folder
This part is working, the problem lies in the function attached to each of these context menus. At the moment clicking 'file' or 'folder' calls: this.create(obj);
How do I specify the type? I've tried obj.attr("rel","type","folder")
, I've tried obj.rslt.rel
and many others but I'm just shooting in the dark, lol. I have gone through the documentation, the layout is good but its useless for explaining the properties of objects.
Below is the code for the context menu, the types plugin and the bind for the create node.
fma_jstree = $("#archive")
.bind("before.jstree", function (e, data) {
$("#alog").append(data.func + "<br />");
})
.jstree({
// List of active plugins
"plugins" : [
"themes","json_data","ui","crrm","cookies","dnd","search","types","hotkeys","contextmenu"
//"themes","json_data","ui","crrm","cookies","dnd","search","types","contextmenu"
],
"contextmenu" : {
items : { // Could be a function that should return an object like this one
"create" : {
"separator_before" : false,
"separator_after" : true,
"label" : "Create",
"action" : false,
"submenu" :{
"create_file" : {
"seperator_before" : false,
"seperator_after" : false,
"label" : "File",
action : function (obj) {
this.create(obj);
}
},
"create_folder" : {
"seperator_before" : false,
"seperator_after" : false,
"label" : "Folder",
action : function (obj) { this.create(obj); }
}
}
}
}
},
// Using types - most of the time this is an overkill
// read the docs carefully to decide whether you need types
"types" : {
// I set both options to -2, as I do not need depth and children count checking
// Those two checks may slow jstree a lot, so use only when needed
"max_depth" : -2,
"max_children" : -2,
// I want only `drive` nodes to be root nodes
// This will prevent moving or creating any other type as a root node
"valid_children" : [ "drive" ],
"types" : {
// The default type
"default" : {
// I want this type to have no children (so only leaf nodes)
// In my case - those are files
"valid_children" : "none",
// If we specify an icon for the default type it WILL OVERRIDE the theme icons
"icon" : {
"image" : icon_url + "/file.png"
}
},
// The `folder` type
"folder" : {
// can have files and other folders inside of it, but NOT `drive` nodes
"valid_children" : [ "default", "folder" ],
"icon" : {
"image" : icon_url + "/folder.png"
}
},
// The `drive` nodes
"drive" : {
// can have files and folders inside, but NOT other `drive` nodes
"valid_children" : [ "default", "folder" ],
"icon" : {
"image" : icon_url + "/root.png"
},
// those prevent the functions with the same name to be used on `drive` nodes
// internally the `before` event is used
"start_drag" : false,
"move_node" : false,
"delete_node" : false,
"remove" : false
}
}
},
.bind("create.jstree", function (e, data) {
//if creating a root node
if(!$(data.rslt.parent).attr("id")) var id = 1;
//else get parent
else var id = data.rslt.parent.attr("id").replace("node_","");
$.post(
ajaxurl,
{
"action" : "fma_create_node",
"operation" : "create_node",
"id" : id,
"position" : data.rslt.position,
"title" : data.rslt.name,
"type" : data.rslt.obj.attr("rel")
},
function (r) {
if(r.status) {
$(data.rslt.obj).attr("id", "node_" + r.id);
}
else {
$.jstree.rollback(data.rlbk);
}
},
'json'
);
})
any help would be well appreciated ;)
regards,
Daithi
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
解决了;)
指定要创建的节点类型的代码是:
所以现在 contextmenu 插件的代码如下所示:
对于任何菜鸟 - 如果您查看发布的问题中发布的代码,您应该能够看到它的去向。
solved it ;)
the code to specify the type of node to create is:
so now the code for the contextmenu plugin looks like this:
For any noobs - if you look at the code posted in the posted question you should be able to see where this goes.