想要的：在ExtJS

Question

中定製樹與樹的拖拽實現的方向/想法我需要一些關於在兩棵樹之間拖拽的組合功能ExtJS。

第一所需的功能非常簡單，只是孤立的單一樹只有內置拖放功能。

第二所需的特徵就是，我wan't用戶能夠從左樹拖動節點，並在右側樹任何節點放棄它。

的行動不應該從左樹刪除節點，從而在右樹從左樹拖動同一個節點到多個地方的可能性。

我的問題是：我應該採取哪一種方法，而無需再次發明輪子這兩個功能結合起來，利用在TreePanel對象的現有可能性？我不是在尋找一個完整的解決方案（雖然;-)會很好），而是如何處理拖放區域，事件等等。

Answer 1

好的。我一直在思考這個一段時間了，下面的方法似乎爲我工作:)

我已經配置了左樹這樣的：

listeners: 
{ 
    beforenodedrop: function (dropEvent) { 
     // Does this node come from the right tree? 
     if (dropEvent.source.tree.id !== dropEvent.tree.id) { 
      // The node should be discarded. 
      dropEvent.dropNode.parentNode.removeChild(dropEvent.dropNode, true); 

      // The node has been discarded, return drop succeeded. 
      dropEvent.dropStatus = true; 
      return false; 
     } 
     return true; 
    }, 
    nodedragover: function (dragevent) { 
     // If the node comes from the right tree, it is allowed to be dropped here. 
     if (dragevent.source.tree.id !== dragevent.tree.id) { 
      return true; 
     } 
     // A node from this tree is not allowed to be dropped. 
     return false; 
    } 
} 

的權樹配置像這樣：

listeners: 
{ 
    beforenodedrop: function (dropEvent) { 
     // Does this node come from the left tree? 
     if (dropEvent.source.tree.id !== dropEvent.tree.id) { 
      // The node should be cloned and inserted in the right tree. 

      // Copy the node. 
      var node = dropEvent.dropNode; // the node that was dropped 
      var nodeCopy = new Ext.tree.TreeNode(// copy it 
       Ext.apply({}, node.attributes) 
      ); 
      // Match the id's. 
      nodeCopy.id = Ext.id(null,'newnode') + '_' + node.id; 

      // Find the right place to put it. 
      if (dropEvent.target.parentNode === dropEvent.tree.getRootNode()) { 
       // The node is placed on a folder, thus drop it there. 
       dropEvent.target.appendChild(nodeCopy); 
      } else { 
       // The node is placed inside a folder, thus place it in there. 
       dropEvent.target.parentNode.appendChild(nodeCopy); 
      } 

      // The node has been dropped, return okay and stop further process. 
      dropEvent.dropStatus = true; 
      return false; 
     }   
     // Just use the normal builtin drag and drop. 
     return true; 
    } 
} 

樹木都已經被設置爲啓用中拖放：

enableDD: true 

個

所有葉節點具有以下配置：

allowDrop: true, 
draggable: true 

所有文件夾設置爲：

allowDrop: true, 
draggable: false 

的結論是，我所選擇重寫某些內建drag'n」的在treepanel中放置方法，同時仍保持內置功能。