Ext.data.TreeStore

最新推荐文章于 2023-05-12 17:23:55 发布

萝卜耳朵

最新推荐文章于 2023-05-12 17:23:55 发布

阅读量4.5k

点赞数

分类专栏： ExtJS 文章标签： treepanel

ExtJS 专栏收录该内容

33 篇文章 2 订阅

订阅专栏

研究一下 extjs的tree树形结果，已经封装的很简单了

 
       Ext.require([ 
      
       'Ext.tree.*' 
       , 
      
       'Ext.data.*' 
      
       ]); 
      
       Ext.onReady( 
       function 
       () { 
      
       var  
       store = Ext.create( 
       'Ext.data.TreeStore' 
       , { 
      
       proxy: { 
      
       type:  
       'ajax' 
       , 
      
       url:  
       'get-nodes.php' 
       , 
      
       extraParams: { 
      
       isXml:  
       true 
      
       }, 
      
       reader: { 
      
       type:  
       'xml' 
       , 
      
       root:  
       'nodes' 
       , 
      
       record:  
       'node' 
      
       } 
      
       }, 
      
       sorters: [{ 
      
       property:  
       'leaf' 
       , 
      
       direction:  
       'ASC' 
      
       },{ 
      
       property:  
       'text' 
       , 
      
       direction:  
       'ASC' 
      
       }], 
      
       root: { 
      
       text:  
       'Ext JS' 
       , 
      
       id:  
       'src' 
       , 
      
       expanded:  
       true 
      
       } 
      
       }); 
      
       // create the Tree 
      
       var  
       tree = Ext.create( 
       'Ext.tree.Panel' 
       , { 
      
       store: store, 
      
       hideHeaders:  
       true 
       , 
      
       rootVisible:  
       true 
       , 
      
       viewConfig: { 
      
       plugins: [{ 
      
       ptype:  
       'treeviewdragdrop' 
      
       }] 
      
       }, 
      
       height: 350, 
      
       width: 400, 
      
       title:  
       'Directory Listing' 
       , 
      
       renderTo:  
       'tree-example' 
       , 
      
       collapsible:  
       true 
      
       }); 
      
       });