Question

ExtJs收缩栏位置改变需求

请问一下怎么把north位置面板收缩栏位置放在bbar里面？ 当单击折叠栏时候，进行收缩，收缩后位置同当前折叠栏位置
原图显示下图

用ps修改过的 ，请问这类需求用ExtJs4.2版本如何实现？

收缩后图





Answer 1

定义这个面板的时候定义一个id
然后在bbar里面定义两个按钮，收缩/展开，然后分别调用
Ext.getCmp('面板id').collapse(true);
Ext.getCmp('面板id').expand(true) ;

如果你就想用一个按钮来控制，那么页面一打开，加载完面板之后，你默认设置展开
那么你下面的按钮就显示收缩，然后当你点击收缩按钮之后，再控制显示的值，已经调用的方法

追问

最后一张图是显示收缩后的，也就是bbar还显示，这位仁兄说的只是调用方法收缩了，但是bbar也隐藏了，有属性不隐藏的吗？

追答

你点击的收缩，难道不是收缩整个面板吗？
右上角的那个收缩，难道不是收缩整个面板吗？一样的嘛

展开/收缩就那两个方法
bbar里面你定义一个按钮，这个按钮用于来控制 展开/收缩。
然后面板一加载，就默认它展开,同时给下面的bbar，那个按钮设置名称为收缩
然后你又获取按钮名称，判断是调用那个方法。不就样嘛，有啥难的

追问

当面板收缩后bbar也隐藏了，有办法不隐藏bbar吗?

追答

那你 bbar 别放在面板里面。
定义2个div 分别给设置一个id
然后，将面板渲染到第一个div 标签中，
将bbar渲染到第2个div上，这不就吧bbar脱离面板了嘛

追问

var pnNorth=new Ext.Panel({
id:'pnNorth',
region:'north',
html:...,
bbar:[{
text: '收缩/展开',
handler: function(){Ext.getCmp('pnNorth').collapse();}
}]
});
小弟愚钝不明白怎么弄 ？ 望指点 谢谢

追答

我感觉我上一条的回复已经很清晰了，唉.........
你的这种写法，bbar是在pnNorth面板里面,当你点收缩之后，请问，你如何使用bbar里面的展开？

所以，我让你定义2个div。两个div上都定义不同id
然后分别将panel 以及bbar 渲染 指向这2个div，那么 panel  和 bbar明显分离了.这不就满足你需求
了嘛，el  /contentEl   /  这些 都可以把你 定义的 panel或 bbar放到你定义的div上，造成分离效果

追问

我的QQ是1056 856 191 您的QQ是多少？ 您能看一下我代码吗？ 我的理解可能有些偏离，您帮帮忙解决一下好吗？ 解决完毕就结贴了 谢谢了

Answer 2

　　树形结构，是程序开发，不可缺少的组件之一。ExtJs中的树，功能强大美观实用。功能齐全，拖拉，排序，异步加载等等。
　　在ExtJs4中Tree和Grid具有相同的父类，因此Grid具有的特性和插件在Tree上也能用。
　　treePanel展开所有，关闭所有。
　　CatalogTtree.expandAll(); //展开所有节点
　　CatalogTtree.collapseAll(); //关闭所有节点
　　TreeGrid简例,带弹出window的form表单。