Code:
Ext.BLANK_IMAGE_URL = '/ext/resources/images/default/s.gif';
Ext.onReady(function() {
Ext.QuickTips.init();
//Ext.form.Field.prototype.msgTarget = 'side';
var win = new Ext.Window({
id: 'tabsinform-win'
,width: 600
,minWidth: 240
,height: 428
,minHeight: 160
,layout: 'fit'
,title: Ext.get('page-title').dom.innerHTML
,closable: false
,defaults: {
labelWidth: 100
,hideMode: 'offsets'
,defaultType: 'textfield'
}
// form
,items: [{ // Create a form on this level because save should transfer all tabs to the script
xtype: 'form'
,id: 'tabsinform-form'
,border: false
,url: 'tabs.php'
,frame: true
// tabpanel
,items: [{ // tabpanel container
xtype: 'tabpanel'
,activeItem: 0
,anchor: '100% 100%' // tabpanel should use complete space not only what is used by additional components
,deferredRender: false // transfer all fields to the url defined in the form
,items: [{ // First tab
title: 'General'
,layout: 'form' // Layout in the tab is form
,defaults: {
width: 350 // default width for all fields
}
,items: [{ // first field
fieldLabel: 'Text'
,xtype: 'textfield'
},{ // second line, should consists of two fields with two fieldLabels
layout: 'column'
,autoWidth: true
,items: [{
// left column
layout: 'form'
,items: [{
xtype: 'textfield'
,width: 45
,fieldLabel: 'Postal Code'
}]
},{
// right column
layout: 'form'
,labelWidth: 30
,items: [{
xtype: 'textfield'
,width: 270
,hideLabel: false
,fieldLabel: 'City'
}]
}]
}]
},{
title: 'Tab 2'
,items: [{
xtype: 'tabpanel'
,activeTab: 0
,items: [{
title: 'tab2, subtab1'
},{
title: 'tab2, subtab2'
}]
}]
}]
}]
}]
});
win.show();
});