EXT 4.0 TreeGrid 使用

TreeView使用

调用

1   var tree = new OpenWindowMaterialMessage();
2                 tree.setIds("MaterialInsert_MaterialMessageIds_new");

弹出treeWindow

 1 function OpenWindowMaterialMessage() {
 2     this.url = "XXXX.aspx";
 3     var Ts = this;
 4     Ext.define('Message', {
 5         extend: 'Ext.data.Model',
 6         fields: [
 7             { name: 'Num', type: 'string' },
 8             { name: 'Name', type: 'string' },
 9             { name: 'Id', type: 'string' }
10         ]
11     });
12     var s = Ext.create('Ext.data.TreeStore', {
13         model: 'Message',
14         proxy: {
15             type: 'ajax',
16             url: Ts.url
17         },
18         folderSort: true
19     });
20     s.load({ params: { operate: "LoadData_MessageTree"} });
21     var tree = Ext.create('Ext.tree.Panel', {
22          500,
23         height: 300,
24         renderTo: Ext.getBody(),
25         useArrows: true,
26         rootVisible: false,
27         store: s,
28         multiSelect: true,
29         singleExpand: true,
30         columns: [{
31             xtype: 'treecolumn',
32             text: 'name',
33             flex: 2,
34             sortable: true,
35             dataIndex: 'Name'
36         }, {
37             text: 'Id',
38             flex: 1,
39             sortable: true,
40             dataIndex: 'Id',
41             hidden: true
42         }, {
43             text: 'Num',
44             flex: 1,
45             dataIndex: 'MaterialNum',
46             sortable: true
47         }]
53     });
54     Ts.treeWin = Ext.create("Ext.window.Window", {
55         title: '添加数据',
56         items: tree,
57         layout: 'fit',
58         buttons: [{ text: "提交", handler: function () { subTree(); } }, { text: "取消", handler: function () { Ts.close(); } }]
59     });
60     function subTree() {
61         var records = tree.getView().getChecked();
62         if (records.length == 0) {
63             Ext.Msg.alert('提示', '请选择要添加的数据！');
64         } else {
65             var ids = [];
66             Ext.Array.each(records, function (rec) {
67                 ids.push(rec.data.MaterialId);
68             });
69             Ext.getCmp(Ts.IdsField).setValue(ids.join(','));
70             var value = Ext.getCmp(Ts.IdsField).getValue();
71             Ts.treeWin.close();
72         }
73     }
74     Ts.IdsField = '';
75     Ts.setIds = function (idsField) {
76         Ts.treeWin.show();
77         Ts.IdsField = idsField;
78     }
79 
80 }

数据格式

  1 {"text":".","children": [
  2     {
  3         task:'Project: Shopping',
  4         duration:13.25,
  5         user:'Tommy Maintz',
  6         iconCls:'task-folder',
  7         expanded: true,
  8         children:[{
  9             task:'Housewares',
 10             duration:1.25,
 11             user:'Tommy Maintz',
 12             iconCls:'task-folder',
 13             children:[{
 14                 task:'Kitchen supplies',
 15                 duration:0.25,
 16                 user:'Tommy Maintz',
 17                 leaf:true,
 18                 iconCls:'task',
 19                   "checked": false
 20             },{
 21                 task:'Groceries',
 22                 duration:.4,
 23                 user:'Tommy Maintz',
 24                 leaf:true,
 25                 iconCls:'task',
 26                   "checked": false
 27             },{
 28                 task:'Cleaning supplies',
 29                 duration:.4,
 30                 user:'Tommy Maintz',
 31                 leaf:true,
 32                 iconCls:'task',
 33                   "checked": false
 34             },{
 35                 task: 'Office supplies',
 36                 duration: .2,
 37                 user: 'Tommy Maintz',
 38                 leaf: true,
 39                 iconCls: 'task',
 40                   "checked": false
 41             }]
 42         }, {
 43             task:'Remodeling',
 44             duration:12,
 45             user:'Tommy Maintz',
 46             iconCls:'task-folder',
 47             expanded: true,
 48             children:[{
 49                 task:'Retile kitchen',
 50                 duration:6.5,
 51                 user:'Tommy Maintz',
 52                 leaf:true,
 53                 iconCls:'task',
 54                   "checked": false
 55             },{
 56                 task:'Paint bedroom',
 57                 duration: 2.75,
 58                 user:'Tommy Maintz',
 59                 iconCls:'task-folder',
 60                 children: [{
 61                     task: 'Ceiling',
 62                     duration: 1.25,
 63                     user: 'Tommy Maintz',
 64                     iconCls: 'task',
 65                     leaf: true,
 66                       "checked": false
 67                 }, {
 68                     task: 'Walls',
 69                     duration: 1.5,
 70                     user: 'Tommy Maintz',
 71                     iconCls: 'task',
 72                     leaf: true,
 73                       "checked": false
 74                 }]
 75             },{
 76                 task:'Decorate living room',
 77                 duration:2.75,
 78                 user:'Tommy Maintz',
 79                 leaf:true,
 80                 iconCls:'task'
 81             },{
 82                 task: 'Fix lights',
 83                 duration: .75,
 84                 user: 'Tommy Maintz',
 85                 leaf: true,
 86                 iconCls: 'task'
 87             }, {
 88                 task: 'Reattach screen door',
 89                 duration: 2,
 90                 user: 'Tommy Maintz',
 91                 leaf: true,
 92                 iconCls: 'task'
 93             }]
 94         }]
 95     },{
 96         task:'Project: Testing',
 97         duration:2,
 98         user:'Core Team',
 99         iconCls:'task-folder',
100         children:[{
101             task: 'Mac OSX',
102             duration: 0.75,
103             user: 'Tommy Maintz',
104             iconCls: 'task-folder',
105             children: [{
106                 task: 'FireFox',
107                 duration: 0.25,
108                 user: 'Tommy Maintz',
109                 iconCls: 'task',
110                 leaf: true
111             }, {
112                 task: 'Safari',
113                 duration: 0.25,
114                 user: 'Tommy Maintz',
115                 iconCls: 'task',
116                 leaf: true
117             }, {
118                 task: 'Chrome',
119                 duration: 0.25,
120                 user: 'Tommy Maintz',
121                 iconCls: 'task',
122                 leaf: true
123             }]
124         },{
125             task: 'Windows',
126             duration: 3.75,
127             user: 'Darrell Meyer',
128             iconCls: 'task-folder',
129             children: [{
130                 task: 'FireFox',
131                 duration: 0.25,
132                 user: 'Darrell Meyer',
133                 iconCls: 'task',
134                 leaf: true
135             }, {
136                 task: 'Safari',
137                 duration: 0.25,
138                 user: 'Darrell Meyer',
139                 iconCls: 'task',
140                 leaf: true
141             }, {
142                 task: 'Chrome',
143                 duration: 0.25,
144                 user: 'Darrell Meyer',
145                 iconCls: 'task',
146                 leaf: true
147             },{
148                 task: 'Internet Exploder',
149                 duration: 3,
150                 user: 'Darrell Meyer',
151                 iconCls: 'task',
152                 leaf: true
153             }]
154         },{
155             task: 'Linux',
156             duration: 0.5,
157             user: 'Aaron Conran',
158             iconCls: 'task-folder',
159             children: [{
160                 task: 'FireFox',
161                 duration: 0.25,
162                 user: 'Aaron Conran',
163                 iconCls: 'task',
164                 leaf: true
165             }, {
166                 task: 'Chrome',
167                 duration: 0.25,
168                 user: 'Aaron Conran',
169                 iconCls: 'task',
170                 leaf: true
171             }]
172         }]
173     }
174 ]}