Как показать родительский элемент и дочерний элемент в отдельном div в дереве JQuery?

Question

Я использую JQuery Fancy Treeверсия 2.3.0. Мне нужно, чтобы показать пункты подменят родитель, щелкать родительский узел в отдельном DIV

Сценарий:

На загрузке страницы, родительские элементы будут перечислены в делах. При нажатии любого из родительского элемента мне нужно загрузить дочерние элементы в другой div. Как я мог это достичь?

Answer 1

Вы можете достичь этого, используя 2 дерева и повторно загрузив дочернее дерево по методу activate родительского дерева.

<script type="text/javascript"> 
$(function() { 
    // Create your parent tree, set activate method to create child tree when 
    // parent node is selected 
    $("#tree").fancytree({ 
     activate: function(event, data) { 
      // Use key of selected parent node to load child tree 
      createChildTree(data.node.key); 
     } 
    }); 

    // Create empty child tree 
    $("#tree2").fancytree(); 
}); 

function createChildTree(key) { 
    // Remove current child tree (allows new tree to be created using key from 
    // selected parent) 
    $("#tree2").fancytree("destroy"); 

    // Create new child tree using key from selected parent 
    $("#tree2").fancytree({ 
     source: { 
      url: "/source/url", 
      data: { "key": key } 
     } 
    }); 
} 
</script> 

<div id="tree"></div> 
<div id="tree2"></div>