如何动态加载accordion布局的panel呢？

最新推荐文章于 2020-07-10 00:36:34 发布

pxsnow

最新推荐文章于 2020-07-10 00:36:34 发布

阅读量220

点赞数

文章标签： EXT Ajax 网络应用 json PHP

本文链接：https://blog.csdn.net/pxsnow/article/details/83328786

版权

这种效果是可以实现的,只需要监听一个事件,然后通过AJAX取得JSON格式的菜单项目信息,然后动态的对这个TreePanel添加就行了,我试了效果已出来,代码如下:
......
this.accPanel = new Ext.Panel({
region:'west',
baseCls:'x-panel',
split:true,
title:'系统菜单',
collapsible :true,
layoutConfig:{
animate:true
},
width: 210,
layout:'accordion',
listeners:{'beforerender':function(){
alert('hi,,,,,');
Ext.Ajax.request({
url: 'scripts/addModel.php?action=0',
success: function(request){
var mydata=Ext.decode(request.responseText);
for(var i=0;i<mydata.total;i++){
var id = mydata.root[i].id;
var tmp = new Ext.Panel({
id:id,
region:'west',
title:mydata.root[i].modelName,
baseCls:'x-panel',
border:false,
autoWidth:true
});
//this.add(this.id)
//alert(mydata.root[i].id);
alert(this.title);
this.add(tmp);
this.doLayout(true);
//this.ownerCt.ownerCt.add(id)
//alert();
//this.ownerCt.ownerCt.add(this.id);
}
//return true;
},
scope:this,
failure: function(){
alert('error');
}
});
}},
items: [this.item1,this.item2]
});
var tab = new Ext.Panel({
title: '系统介绍',
id: 'docs',
bodyStyle:'padding:10px',
autoLoad: 'docs.html',
layout: 'fit'
});
......
这是我现在做的一个系统里面用到的一部分代码,希望能帮上你的忙.