Extjs异步加载树

最新推荐文章于 2014-09-25 20:38:07 发布

原创最新推荐文章于 2014-09-25 20:38:07 发布 · 841 阅读

0 ·

CC 4.0 BY-SA版权

Extjs 专栏收录该内容

7 篇文章

订阅专栏

本文介绍如何使用ExtJS框架创建一个权限管理的树形组件。该组件通过Ajax方式加载数据，并实现节点展开与折叠的功能。文章详细展示了store配置与treepanel组件的设置过程。

store代码：

var storeTree_<?=$jsObjectSuffix?> = Ext.create('Ext.data.TreeStore', {

nodeParam: 'PID',
fields: [
{name: 'text', type: 'string'},
{name: 'iconCls', type: 'string'},
{name: 'className', type: 'string'}
],
proxy: {
type: 'ajax',
url: 'url'
},
root: {
text: '根节点',
id: 0,
expanded: true
},
reader:{
type: 'json'
},
autoLoad: true

});

Ext.tree.panel代码：

{
xtype: "button",
text: "查看权限树",
handler: function(){
Ext.create('Ext.window.Window', {
title: '权限树',
closeAction: 'hide',
width: 450,
height: 300,
layout: 'fit',
modal:true,
items:[
{
xtype: 'treepanel',
rootVisible: false,
width: 200,
height: 150,
store: storeTree_<?=$jsObjectSuffix?>,
listeners:{
'load': function(treestore, node, record, success){
if(success && record.length>0){
node.set('leaf', false);
}else{
node.set('leaf', true);
}
}
}
}