Supial
23 Jan 2012, 7:42 AM
Greetings,
This is a follow up to the following thread.
http://www.sencha.com/forum/showthread.php?175371-Panel-Disappears-When-Collapsed
Below is a code sample that shows a panel with several components, and when the panel is collapsed, the entire panel disapears and can not be expanded. If a layout is not specified I believe that the default is 'auto' so therefore a layout config is always defined.
Ext.require([
'*'
]);
Ext.onReady(function() {
Ext.create('Ext.container.Viewport',{
id:'viewport',
layout:'border',
items: [{
region:'north',
id:'northbanner',
autoHeight:true,
html:'<H1>BANNER GOES HERE</H1>'
},{
region:'west',
id:'utilpanel',
minWidth:200,
maxWidth:400,
split:true
},{
region:'center',
layout: {type:'table',columns:1,tableAttrs:{style:{width:'100%'}}},
id:'page'
}]
});
// This is done purposly as this is how my server needs to generate the code.
Ext.getCmp('page').add({
xtype:'panel',
id:'activities',
layout:'border',
border:true,
collapsible:true,
title:'My Activities test',
style:{padding:2},
height: 225,
items:[
{
xtype:'datepicker',
id:'alertsDate',
format: 'm/d/Y',
region: 'east',
disabledDatesText:'Disabled',
disabledDaysText:'Disabled',
minText:'The date in this field must be equal to or after {0}',
maxText:'The date in this field must be equal to or before {0}',
toYYYYMMDD: function() {
var me = this;
return me.getValue() != null ? (Ext.isDate(me.getValue()) ? Ext.Date.format(new Date(me.getValue()),'Ymd') : me.getValue()) : '';
}
},{
region: 'center',
id:'regc',
html: '<p>Grid</p>'
}
]
});
});
If the 'center' panel (id:'page') is set to 'fit' then the panel is collapsed properly. Any other layout config seems to remove the panel entirely. Is there something wrong with the code, or is this a bug?
Cheers,
Marcel
This is a follow up to the following thread.
http://www.sencha.com/forum/showthread.php?175371-Panel-Disappears-When-Collapsed
Below is a code sample that shows a panel with several components, and when the panel is collapsed, the entire panel disapears and can not be expanded. If a layout is not specified I believe that the default is 'auto' so therefore a layout config is always defined.
Ext.require([
'*'
]);
Ext.onReady(function() {
Ext.create('Ext.container.Viewport',{
id:'viewport',
layout:'border',
items: [{
region:'north',
id:'northbanner',
autoHeight:true,
html:'<H1>BANNER GOES HERE</H1>'
},{
region:'west',
id:'utilpanel',
minWidth:200,
maxWidth:400,
split:true
},{
region:'center',
layout: {type:'table',columns:1,tableAttrs:{style:{width:'100%'}}},
id:'page'
}]
});
// This is done purposly as this is how my server needs to generate the code.
Ext.getCmp('page').add({
xtype:'panel',
id:'activities',
layout:'border',
border:true,
collapsible:true,
title:'My Activities test',
style:{padding:2},
height: 225,
items:[
{
xtype:'datepicker',
id:'alertsDate',
format: 'm/d/Y',
region: 'east',
disabledDatesText:'Disabled',
disabledDaysText:'Disabled',
minText:'The date in this field must be equal to or after {0}',
maxText:'The date in this field must be equal to or before {0}',
toYYYYMMDD: function() {
var me = this;
return me.getValue() != null ? (Ext.isDate(me.getValue()) ? Ext.Date.format(new Date(me.getValue()),'Ymd') : me.getValue()) : '';
}
},{
region: 'center',
id:'regc',
html: '<p>Grid</p>'
}
]
});
});
If the 'center' panel (id:'page') is set to 'fit' then the panel is collapsed properly. Any other layout config seems to remove the panel entirely. Is there something wrong with the code, or is this a bug?
Cheers,
Marcel