ExtJs中tree根据查询条件重新load数据

本文介绍如何在ExtJs中根据查询条件重新加载Tree的数据。首先创建了一个ColumnTree,并设置了相关配置如dataUrl、loader等。然后通过监听器在加载前更新baseParams以传递查询条件,实现节点异步加载。最后展示了筛选数据并加载到Tree的操作过程。

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

首先我们可以先定义一个tree如下:

var tree = new Ext.tree.ColumnTree({
region:'center',
border : false,
lines : false,
id :'aphyciniTree',
width : '100%',
cls : 'columntree_header_bg',
bodyStyle : 'overflow-x:hidden; overflow-y:auto;',
animate : false,
rootVisible : false,
autoScroll : true,
onlyLeafCheckable : false,// 所有结点可选,如果不需要checkbox,该属性去掉
loadMask : true,
loader : new Ext.tree.TreeLoader({
dataUrl : 'StudentStatusJsp/listGraduationQualificationsMajors.action',
uiProviders : {
'col' : Ext.ux.ColumnTreeCheckNodeUI
},
baseParams : {  
                major : ''  
            },
listeners : {
load : function (){
expand(tree);
}
}
}),
columns : cm,
root : new Ext.tree.AsyncTreeNode({
text : 'rootnode'
})
});

第二我们通过查询来筛选数据

 var condition = Ext.getCmp('graMajor_id').getValue();  
                           var aphyciniTree = Ext.getCmp('aphyciniTree');  
                           var loader = aphyciniTree.getLoader();  
                           loader.on('beforeload', function(loader, node) {  
                               this.baseParams.major = condition; // 通过这个传递参数,这样就可以点一个节点出来它的子节点来实现异步加载  
                           }, loader);  
 
                           loader.load(aphyciniTree.root);  
                           Ext.getCmp('aphyciniTree').expandAll(); 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值