首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > JavaScript >

ExtJs 树形菜单 Tab标签页器皿展现内容

2012-10-28 
ExtJs 树形菜单 Tab标签页容器展现内容项目中用到了树形菜单,但看代码后,发现有些属性怪怪的,有和没有,页

ExtJs 树形菜单 Tab标签页容器展现内容
项目中用到了树形菜单,但看代码后,发现有些属性怪怪的,有和没有,页面显示的结果是一样的,为了搞清楚如果弄树形菜单,Ricki自己依样画葫芦,仿造了一个,过程中确实学到不少,所以说,看还不如动手更能掌握,代码如下:



PS:需要注意的问题
1.必须在TreePanel中设置root,否则将报'this.root'为空或不是对象
2.如果在TreePanel中设置region的值,那么Viewport的layout须为border。如:
region : String
Note: this config is only used when this BoxComponent is rendered by a Container which has been configured to use the BorderLayout layout manager (e.g. specifying layout:'border').
3.只设置TreePanel的region的值还不够,还必须设置TabPanel的region值,否则将报:
uncaught exception: No center region defined in BorderLayout ext-comp-1004
4.A TreeLoader provides for lazy loading of an Ext.tree.TreeNode's child nodes from a specified URL. The response must be a JavaScript Array definition whose elements are node definition objects.e.g.:
[{
        id: 1,
        text: 'A leaf Node',
        leaf: true
    },{
        id: 2,
        text: 'A folder Node',
        children: [{
            id: 3,
            text: 'A child Node',
            leaf: true
        }]
   }]
根据这个,只需在server端返回一个节点数组即可。
其中每个节点差不多如下定义:
public class  Note{
private int id;
private String text;
private String href;
private boolean leaf;//true if this node is a leaf and does not have children
private ArrayList<Note> Notes;//存放子菜单
......
}
5.当rootVisible为true时,则根节点将显示(这个看自己的情况而定)

6.如果想实现有复选框的树形菜单,那么只需在上面的Note对象中添加boolean checked属性即可。

有空的话,欢迎到红番薯逛逛

热点排行
Bad Request.