zoukankan      html  css  js  c++  java
  • 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 ]}
    
    
  • 相关阅读:
    常用css3属性
    jQuery瀑布流
    jQuery事件对象
    jQuery动画
    面向对象复习
    php 面向对象
    git
    存储数据
    ajax
    对象
  • 原文地址:https://www.cnblogs.com/sunjinpeng/p/2295919.html
Copyright © 2011-2022 走看看