1 Attachment(s)
Panel with borderLayout fill it's parent body
I want to add panel to one of tabs of tabPanel, I use border layout for panel but when i add panel to tab it can't fill it's parent body.
panel code:
Code:
var viewport = Ext.create('Ext.panel.Panel', { layout: {
type: 'border',
padding: 5
},
defaults: {
split: true,
anchor:'100%'
},
id:'viewPort',
width:1200,
height:750,
items: [{
region: 'west',
collapsible: true,
title: 'Starts at width 30%',
split: true,
width: '17%',
minWidth: 100,
minHeight: 140,
layout:{
type:'vbox',
align:'stretch'
},
items: [show,treePanel,propGrid]
},tabs]
});
tab code that is parent of panel and when user click on it panel loaded to it dynamically:
Code:
var mainTabs = Ext.create('Ext.tab.Panel', { layout: 'anchor',
id:'mtabs',
defaults: {
split: true,
anchor: '100%'
},
items: [{
title: 'Layout Window',
closeAction: 'hide',
layout: {
type: 'border',
padding: 5
},
//anchor: '100%',
width:600,
height:600,
listeners: {
activate:function (tab) {
}
},
items: [{
region: 'west',
collapsible: true,
title: 'Starts at width 30%',
split: true,
width: '17%',
minWidth: 100,
minHeight: 140,
layout:'vbox',
items: [historyTreePanel,propGrid]
},tabs]
},{
title: 'History',
//xtype:'panel',
/*width:2000,
height:1024,*/
html: 'Please Wait...',
id:'history-tab',
layout:'fit',
layout: 'hbox',
default: {
anchor:'100%'
},
//iconCls: 'favorites',
//cls: 'card1',
listeners: {
activate:function (tab) {
if(!flag){
flag = true;
$.getScript("/FleetManagement/js/history/fleethistory.js", function(data, textStatus, jqxhr) {
var historyTab = Ext.getCmp('history-tab');
historyTab.add(viewport);
historyTab.doLayout();
});
}
}
}
}],
renderTo : Ext.getBody()
});
});
in the above code tab with id:'history-tab' is my mentioned tab.How can i fix this problem?
Attachment 40673