双jsTree实现

我是jsTree的新手,我想使用双jsTree。

[左JsTrree] [>>] [右JsTrree]

“>>”:从左到右jsTree复制所选节点的按钮

我想从左到右jsTree复制部分树层次结构。

  • 没有重复的节点。
  • 我不想复制所选节点的子节点
  • 根据右侧jsTree结构,只有左侧jsTree中的选定节点合并到右侧jsTree中

如果用户从左侧jsTree中选择了任何节点,则在按钮(“>>”)上单击我想将部分树从选定节点复制到根节点。

左jsTree如下

Root -----A -----A1 -----A1.1 -----A1.2 -----A2 -----`A2.1` -----A2.2 -----B -----B1 -----B2 -----C -----C1 -----C1.1 -----C2.2 

————————————————– ————————————
现在假设用户选择节点A2.1然后在按钮(“>>”)之后单击以下部分树应该显示在右侧jsTree中

[#1]右jsTree:

  Root -----A -----A2 -----`A2.1` 

现在,在右边的jsTree中添加了根节点,只有选定的节点才能合并到右边的jsTree中。

————————————————– ————————————

现在假设用户选择了C1然后只有C1应该合并到右边的jsTree。

[#2]从左侧jsTree添加C1后的右jsTree结构:

 Root -----A -----A2 -----A2.1 -----C -----`C1` 

假设用户选择A1然后A1应合并到适当的位置
[#3]从左jsTree添加A1后的右jsTree结构:

 Root -----A -----`A1` -----A2 -----A2.1 -----C -----C1 

到目前为止我的解决方法如下

从左侧jsTree选择节点后,我正在从选定节点到根节点构建xml。 并生成存储在cookie中的partial_xml_string。 OnClick(“>>”)按钮我从cookie +清除partial_xml_string的cookie值读取partial_xml_string的值。 [#1]案件做得很好。 有没有其他好方法来实现[#1]案例?

使用.get_path(node,id_mode)我从root到leaf节点获取路径(ID和Name)

如果id_mode = true,则节点ID = Root.id,A.id,A2.id,A2.1.id

如果id_mode = false,则节点名称 = Root,A,A2,A2.1

是否可以将此路径设置为jsTree的右侧?

如果是,那么如何设置此路径? 如果路径已经存在那么如何防止复制 ? else将所选节点合并到右jsTree。

————————————————– ——————————————

使用.bind(“select_node.jstree”,函数(事件,数据),我们可以处理所选节点上的事件。如何处理事件onClick + * icon *?

考虑我的左边jsTree只包含一个带有+图标的Root节点,然后如何在+ icon上处理onClick事件? 看墨水的答案

我想获取所选节点的子节点如何将子节点列表附加到选定节点?

如何使用jsTree函数实现[#2]和[#3]?

任何有关此事的帮助或指导将不胜感激。

我可以用[+]点击事件帮助你。 您必须修改您的jquery.jstree.js(未压缩版本)。 打开它,找到带有toggle_node : function (obj)字符串toggle_node : function (obj) (有一个标签符号,所以搜索toggle_node )并在这里添加1行。 编辑后必须是:

  toggle_node : function (obj) { obj = this._get_node(obj); this.__callback(obj); // these line must be added if(obj.hasClass("jstree-closed")) { return this.open_node(obj); } if(obj.hasClass("jstree-open")) { return this.close_node(obj);} }, 

现在,您可以像往常一样为toggle_node事件绑定回调。 这是一个例子:

  $("#your_jstree").bind("toggle_node.jstree", function (e, data) { is_opened = $(data.rslt).hasClass('jstree-open') ? false : true; node_id = $(data.rslt).attr('id'); alert('node with id='+node_id+' is '+(is_opened ? 'opening' : 'closing')+' now.'); }) 

节点打开或关闭之前的这些回调调用。 而且,在加载树时,此事件不会触发,就像使用open_node事件一样。