fineui什么时候能加上TreePanel的拖拽功能？

の‵℡閊鳮﹌

1. // JScript 文件
   
2. Ext.namespace('Ext.test');
   
3. 
   
4. Ext.test.Panel = function() {
   
5. 
   
6.   this.right = new Ext.Panel({
   
7.         ddGroup: 'TreePanelDDGroup',
   
8.                 border : true,
   
9.                 id : 'right',
   
10.                 title:'Panel',
    
11.                 bodyStyle : 'padding: 5px',
    
12.                 defaults : {
    
13.                 bodyStyle : 'padding-left: 5px'
    
14.                 }
    
15.       });
    
16. 
    
17.   this.left = new Ext.tree.TreePanel({
    
18.         ddGroup: 'TreePanelDDGroup',
    
19.         rootVisible: false,
    
20.         width: 200,
    
21.         split:true,
    
22.         enableDD:true,
    
23.         title: "Drag Tree"
    
24.         /*loader:new Ext.tree.TreeLoader({
    
25.            dataUrl:"Dtree.aspx"
    
26.         }),
    
27.         root:new Ext.tree.AsyncTreeNode({
    
28.            id:'rootid',
    
29.            text:'公司'
    
30.         })*/
    
31.     });
    
32.    
    
33.     //this.left.expandAll();
    
34. 
    
35.   function buildTree(config){
    
36.     if (!config) return null;
    
37.     var c = config.children;
    
38.     config.leaf = c ? false : true;
    
39.     var child, node = new Ext.tree.TreeNode(config);
    
40.     if (node && c && c.length) {
    
41.       for (var i = 0; i < c.length; i++) {
    
42.         child = buildTree(c[i]);
    
43.         if (child) node.appendChild(child);
    
44.         }
    
45.       }
    
46.     return node;
    
47.     }
    
48. 
    
49.   
    
50. 
    
51. var rootDrag = buildTree({
    
52.     id : 'rootDrag',
    
53.     text: 'rootDrag',
    
54.     children: [
    
55.       {id: 1, text: 'childnode1'},
    
56.       {id: 2, text: 'childnode2'},
    
57.       {id: 3, text: 'childnode3'},
    
58.       {id: 4, text: 'childnode4'},
    
59.       {id: 5, text: 'childnode5'}                        
    
60.       ]
    
61.     });
    
62. 
    
63.   this.left.setRootNode(rootDrag);
    
64. 
    
65.   this.right.on('render', this.onRightRender, this);
    
66.   
    
67.   Ext.test.Panel.superclass.constructor.call(this, {
    
68.                                 renderTo : 'pageContainer',
    
69.                                 bodyStyle : 'padding: 5px',
    
70.                                 height : 500,
    
71.                                 width : 760,
    
72.                                 title : 'Demo',
    
73.                                 layout : 'table',
    
74.                                 defaults : {
    
75.                                         height : 200,
    
76.                                         width : 200
    
77.                                 },
    
78.                                 items : [this.left, this.right]
    
79.                         });
    
80. };
    
81. 
    
82. Ext.extend(Ext.test.Panel, Ext.Panel, {
    
83.                         onRightRender : function(cmp) {
    
84.                                 var sourcePanelDropTarget = new Ext.dd.DropTarget(cmp.body.dom,
    
85.                                                 {
    
86.                                                     ddGroup: 'TreePanelDDGroup',
    
87.                                                         notifyDrop : function(ddSource, e, data) {
    
88.                                                             Ext.MessageBox.alert(data.node);
    
89.                                                                 cmp.add(new Ext.Panel({
    
90.                                                                         boder:true,
    
91.                                                                         id:data.node,
    
92.                                                                         bodyStyle : 'padding: 5px',
    
93.                                                 defaults : {
    
94.                                                 bodyStyle : 'padding-left: 5px'
    
95.                                                 }
    
96.                                             }));
    
97.                                                                 cmp.doLayout();
    
98.                                                             data.node.parentNode.removeChild(data.node);
    
99.                                                                 return (true);
    
100.                                                         }
     
101.                                                 });
     
102.                         }
     
103.                 });
     
104. 
     
105. Ext.onReady(function() {
     
106.                         Ext.QuickTips.init();
     
107.                         var panel = new Ext.test.Panel();
     
108.                 });

复制代码

1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="dragTreedropPanel.aspx.cs" Inherits="dragTreedropPanel" %>
   
2. 
   
3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   
4. 
   
5. <html xmlns="http://www.w3.org/1999/xhtml" >
   
6. <head id="Head1" runat="server">
   
7.     <title>无标题页</title>
   
8.     <link href="ExtJS/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
   
9.     <script src="ExtJS/adapter/ext/ext-base.js" type="text/javascript"></script>
   
10.     <script src="ExtJS/ext-all.js" type="text/javascript"></script>
    
11.     <script src="js/JScript.js" type="text/javascript"></script>   
    
12. </head>
    
13. <body>
    
14. <div id="pageContainer"></div>
    
15. </body>
    
16. </html>
    

复制代码