Kendo UI树视图拖放获取目标（丢弃）treeview对象

Question

我有两个TreeViews结构的拖放功能。 Treeviews中的节点可以相互拖放。

如果我拖着从源到目的地的一些内容，我想在控制台

目的地的更新列表，以供参考，您可以检查link here。

在这个演示中，我可以从一个类别移动到另一个类别，但我想捕获更新的包含所有子类别的类别列表。

这里是我的代码

<div id="example"> 
     <div class="demo-section k-content"> 
      <h4>Treeview One</h4> 
      <div id="treeview-left"></div> 
      <h4 style="padding-top: 2em;">Treeview Two</h4> 
      <div id="treeview-right"></div> 
     </div> 

     <script> 
      $("#treeview-left").kendoTreeView({ 
       dragAndDrop: true, 
       dataSource: [ 
        { text: "Furniture", expanded: true, items: [ 
         { text: "Tables & Chairs" }, 
         { text: "Sofas" }, 
         { text: "Occasional Furniture" } 
        ] }, 
        { text: "Decor", items: [ 
         { text: "Bed Linen" }, 
         { text: "Curtains & Blinds" }, 
         { text: "Carpets" } 
        ] } 
       ] 
      }); 

      $("#treeview-right").kendoTreeView({ 
       dragAndDrop: true, 
       dataSource: [ 
        { text: "Storage", expanded: true, items: [ 
         { text: "Wall Shelving" }, 
         { text: "Floor Shelving" }, 
         { text: "Kids Storage" } 
        ] 
        }, 
        { text: "Lights", items: [ 
         { text: "Ceiling" }, 
         { text: "Table" }, 
         { text: "Floor" } 
        ] 
        } 
       ] 
      }); 
     </script> 

片断我怎样才能做到这一点？ 谢谢

Answer 1

我已经创建了一个JsFiddle DEMO here。

您需要将两个TreeView的dragend event绑定到一个函数，然后才能从那里获取目标Treeview列表。下面是从DEMO的片段：我已经更新了我的问题，请看看

function tree_dragend(e) { 
    alert("See your console"); 
    console.log("Drag end sourceNode = ", e.sourceNode, "dropPosition = ", e.dropPosition, "destinationNode = ", e.destinationNode); 

    var destinationTreeviewDOMElement = $(e.destinationNode).closest("div.k-treeview"); 
    console.log("destinationTreeviewDOMElement = ", destinationTreeviewDOMElement); 

    var destinationTreeview = $(destinationTreeviewDOMElement).data("kendoTreeView"); 
    console.log("destinationTreeview = ", destinationTreeview); 

    console.log("destinationTreeviewData = ", destinationTreeview.dataSource.data()); 
} 

var treeview_left = $("#treeview-left").data("kendoTreeView"); 
var treeview_right = $("#treeview-right").data("kendoTreeView"); 

treeview_left.bind("dragend", tree_dragend); 
treeview_right.bind("dragend", tree_dragend);