ExtJS4 TreePanel extraParams传参

最新推荐文章于 2018-09-27 21:39:47 发布

原创最新推荐文章于 2018-09-27 21:39:47 发布 · 1.4w 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#extjs #autoload #function #string #scroll #path

Web View 专栏收录该内容

23 篇文章

订阅专栏

本文介绍了ExtJS 4中TreePanel在构建动态树时如何设置extraParams来传递参数给后台，以便获取子节点数据。动态树通常需要通过根节点的ID向服务器请求子目录信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

ExtJS 4 构建一个视图模式比较固定,这里说说TreePanel 参数问题，除了静态的树,动态树一般都会涉及到根节点传回后台,获取子目录。

1.创建model

//   model
	 Ext.define('Testtree',{
		 extend:'Ext.data.Model',
		 fields:[
			 {name:'id',type:'string'},
			 {name:'text',type:'string'},
			 {name:'isLeaf',type:'boolean'},
			 {name:'path',type:'path'}
	    ]
	 });

2.创建store

//	 store
	 Ext.define('TreeStore',{
	 	extend:'Ext.data.TreeStore',
	 	model:'Testtree',
		autoLoad: false,
	    folderSort: true,
		proxy : {
			type:'ajax',
			actionMethods: 'post',
			url:'./xxx/xxx.action',
			reader: {
				type: "json",
				root: 'data'
			},
			extraParams:{
				root:''
			}
		},
		sorters: [{
			property: 'text',
			direction: 'ASC'
		}]
	 	
	 });

3.创建panel

	 //Treepanl 片段
	 
		xtype:'treepanel',
		id:'testTree',
		name:'itest',
		title: '请选择',
		width: 600,
		height: 80,
		scroll :'vertical',
		rootVisible :false,
		store:testStroe,
		rootVisible: false,
		listeners: {
		//树列表单击，取值赋值给id:xxxx的文本框
			itemclick: function(view,record,item,index,e,eOpts) {            
				var str = record.data.path;
				var fieldChange = Ext.getCmp('xxxx');
				fieldChange.setRawValue(str);
			},
		//点击目录树+前 给root参数赋值
			beforeitemexpand:function(record,eOpts){
				var tp = Ext.getCmp('testTree');
				var root = tp.getStore().getProxy();
				root.extraParams.root = record.data.path;
			}
		}