I have a viewport. My west panel is:
new Ext.Panel({ //west
开发者_JAVA百科 region: 'west',
title: 'דוחות',
id: 'w',
header: true,
width: 190,
split: true,
collapseMode: 'mini',
margins: '0 1 0 0',
collapsible: true,
collapsed: true,
items: ......
My goal is to disable the collapse/expand button and enable it only when something else is made (javascript function - another button clicked).
Is there a way to do it?
Set 'collapsible: false' in the panel's configuration to prevent the titlebar button from being generated. Then, from within whatever custom control you desire, call:
Ext.getCmp('w').toggleCollapse();
Create a subclass of Ext.Panel
with an overridden toggleCollapse
. That's what gets called when you click the collapse/expand button.
Ext.ns('MyExt');
MyExt.LockablePanel = Ext.extend(Ext.Panel, {
cls: 'myext-lockable-panel',
toggleCollapse: function() {
if (this.lockedPanel) {
this[this.collapsed ? 'expand' : 'collapse'](animate);
return this;
}
},
toggleLock: function() {
this.lockedPanel = !this.lockedPanel;
this[this.lockedPanel ? 'addClass' : 'removeClass']('disabled-collapser');
}
});
Just add some opacity to the button and the default cursor when it's disabled-collapser
.
collapsible: true
- I guess you just have to change true to false.
精彩评论