`
happyqing
  • 浏览: 3197914 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Ext4.2 TreeStore data(children)扩展属性

    博客分类:
  • Ext
阅读更多

 

定义一个model,也可以不定义直接写在TreeStore里

	Ext.define('treeModel', {
		extend: 'Ext.data.Model',
		fields: [ 
	         {name: 'text', type: 'string'}, //这个不写就没了
	         {name: 'url', type: 'string'}
         ] 
	});

 

TreeStore

var store = Ext.create('Ext.data.TreeStore', {
			nodeParam: 'id',	//默认的是把id作为node传到后台
			//model: 'treeModel',
			//autoLoad: false, 
			// 属性域
			fields: [ 
		         {name: 'text', type: 'string'}, //这个不写就没了?
		         {name: 'url', type: 'string'}
	            ],
			proxy: {
	            type: 'ajax',
	            url: 'resource/getListByPU.json',
	            reader: {
					type: 'json',
	        		root: 'extTreeVoList' //josn中的根节点
	         	} 
	        },
		    root: {
		    	text: '根节点',
	            id: 0,
		        expanded: true
		    }
//	        ,
//		    sorters: [{
//	            property: 'text',
//	            direction: 'ASC'
//	        }]
		});

 

treePanel

var tree = Ext.create('Ext.tree.Panel', {
	        	//id: extTreeVo.id, //id值可能被占用了
	        		title: 'text',
	                store: store,
	                rootVisible:false,	                
	                useArrows: false,
	                listeners : {  
	                    'itemclick' : function(view,record){  
	                        if(record.data.leaf){  
	                            alert(record.data.id+record.data.url);
	                            alert(record.raw.url); //不扩展也能从raw取
	                        }else{  
//	                            if(record.data.expanded){  
//	                                view.collapse(record);  
//	                            }else{  
//	                                view.expand(record);  
//	                            }  
	                        }  
	                    }  
	                }  
	            });

 

data里貌似有个href可以利用,好像url就不用扩展了

用火狐调试监控的record.data的所有属性

data
	
	Object { id=20,  text="组织机构管理",  parentId=10,  更多...}
id
	
	20
text
	
	"组织机构管理"
parentId
	
	10
index
	
	0
depth
	
	1
expanded
	
	null
expandable
	
	true
checked
	
	null
leaf
	
	true
cls
	
	"file"
iconCls
	
	""
icon
	
	""
root
	
	false
isLast
	
	false
isFirst
	
	true
allowDrop
	
	true
allowDrag
	
	true
loaded
	
	false
loading
	
	false
href
	
	""
hrefTarget
	
	""
qtip
	
	""
qtitle
	
	""
qshowDelay
	
	0
children
	
	null

 

分享到:
评论

相关推荐

    ext树 无限级 json 数据格式 动态加载

    var treeStore = Ext.create('Ext.data.TreeStore', { proxy: { type: 'ajax', url: 'tree_data.json', // JSON数据的URL reader: { type: 'json', rootProperty: 'children' // JSON数据中的子节点属性名 } ...

    ext 树控件+数据库

    var treeStore = Ext.create('Ext.data.TreeStore', { proxy: { type: 'ajax', url: 'tree_data.json', // JSON数据文件路径 reader: { type: 'json', rootProperty: 'nodes' // JSON数据中的根节点属性名 } ...

    Ext树例子

    var store = Ext.create('Ext.data.TreeStore', { root: {children: treeData}, proxy: { type: 'ajax', url: 'tree1.txt' // 如果数据是通过Ajax获取 } }); // 创建TreePanel Ext.create('Ext.tree.Panel...

    如何使用ext写的树形菜单

    var treeStore = Ext.create('Ext.data.TreeStore', { model: 'NodeModel', // 自定义的Model,包含节点字段 root: { text: 'Root Node', expanded: true, // 初始时展开 children: [ { text: 'Child Node 1'...

    Ext JS 深入浅出 树形结构

    Ext JS 是一个强大的JavaScript框架,主要用于构建富客户端应用...通过对`Ext.tree.Panel`、`Ext.data.TreeNode`和`Ext.data.TreeStore`的深入理解和使用,我们可以创建出功能丰富的树形视图,满足各种业务场景的需求。

    EXT构造动态树 包括增删改操作

    - 然后,定义一个`Ext.data.TreeStore`,这是EXT中用于存储和管理树数据的类。你需要提供一个`proxy`来连接到服务器端的数据源,通常使用`Ext.data.proxy.JsonP`或`Ext.data.proxy.Ajax`,以及`reader`来解析返回的...

    Ext树创建说明.rar

    var store = Ext.create('Ext.data.TreeStore', { model: 'NodeModel', root: { text: '根节点', expanded: true, children: [ { text: '子节点1' }, { text: '子节点2' } ] } }); var NodeModel = Ext...

    EXT实现动态树的功能

    var treeStore = Ext.create('Ext.data.TreeStore', { root: { expanded: true, // 初始状态是否展开 children: [ { id: 'node1', text: '节点1', leaf: true }, { id: 'node2', text: '节点2', expanded: true...

    ext TreeGrid分页可编辑

    - 使用`Ext.create`方法创建一个`TreeStore`实例,并配置相应的字段、代理以及根节点等属性。 ```javascript me.treeStore = Ext.create('Ext.data.TreeStore', { fields: ['nid', 'id', 'name', 'sex', 'age'],...

    简单的EXT加载数据的例子

    var treeStore = Ext.create('Ext.data.TreeStore', { proxy: { type: 'ajax', url: 'getTreeViewData.php', // 这是服务器端返回JSON数据的URL reader: { type: 'json', rootProperty: 'nodes' // JSON数据...

    extTree例子点击出现等

    2. **Store**: `TreePanel`与`Ext.data.TreeStore`配合使用来加载和管理数据。`TreeStore`继承自`Ext.data.Store`,并增加了处理层级数据的特性。 3. **Rendering**: 可以通过`viewConfig`配置项来定制节点的渲染,...

    Ext左树有表格 增删改查

    var treeStore = Ext.create('Ext.data.TreeStore', { root: { text: '根节点', children: [ { text: '节点1', leaf: true }, { text: '节点2', expanded: true, children: [ { text: '子节点1', leaf: true }...

    Ext下拉列表树

    数据源可以是JSON格式,每个节点包括`text`(显示文本)、`expanded`(是否默认展开)、`children`(子节点数组)等属性。 3. **树状结构的加载**:`TreeStore`会使用`load`方法从服务器获取数据。数据源可以是远程...

    4.0Ext 树型结构

    var store = Ext.create('Ext.data.TreeStore', { root: { text: 'Root', expanded: true, children: [ {text: 'Child 1', leaf: true}, ... ] } }); Ext.create('Ext.tree.Panel', { title: 'Simple Tree...

    根据输入的关键字过滤ext树节点

    2. **定义数据源**(store):树节点的数据通常存储在Ext.data.TreeStore中,每个节点代表一个记录,包含id、text、children等字段。可以使用Ext.data.Model定义模型,然后通过Ext.data.TreeStore加载数据。 ```...

    ext导步树完整实例

    store: Ext.create('Ext.data.TreeStore', { proxy: { type: 'ajax', url: '/tree/data' }, root: { text: '根节点', expanded: true } }), renderTo: Ext.getBody() }); ``` 通过这个“EXT导步树完整...

    Ext.Tree.Panel

    - 使用`Ext.data.TreeStore`可以更灵活地管理树的数据源,支持远程数据加载和实时更新。 8. **示例代码**: 示例代码中,`treePanel.html`定义了HTML结构,`treePanel.js`包含了`TreePanel`的创建和配置。`...

    Extjs4.2 MVC 左菜单动态加载功能

    extend: 'Ext.data.TreeStore', model: 'MenuModel', proxy: { type: 'ajax', url: 'getMenuData', reader: { type: 'json', rootProperty: 'children' } }, treeLoader: { // 配置项... } }); Ext....

    ext js 下拉树

    1. **store**:下拉树的数据源,通常是一个`Ext.data.TreeStore`实例,它管理着树结构中的节点数据。你需要定义树节点的模型(model),并提供数据源,可以是JSON对象或者远程服务器数据。 2. **displayField**:...

    ext tree 分页

    var store = Ext.create('Ext.data.TreeStore', { autoLoad: false, pageSize: 50, // 每页加载50个节点 proxy: { type: 'ajax', url: 'tree_data.json', reader: { type: 'json', rootProperty: 'children...

Global site tag (gtag.js) - Google Analytics