with a form inside
with tabpanel inside;
I have some fields
and I want to set the padding around the fields
(just as in the examples/form/dynamic.js in the distribution)
the result screenshot is attached
the code:
Ext.onReady(function() {
var formPanelConfig = {
frame: true,
items: [
{
xtype: "tabpanel",
layoutOnTabChange: true,
border: false,
defaults: {bodyStyle: "padding:10px"},
items: [
{
layout: "form",
title: "Tab-1",
items: [
{
xtype: "textfield",
fieldLabel: "field1"
},
{
xtype: "textfield",
fieldLabel: "field2"
}
]
},
{
layout: "form",
title: "Tab-2",
items: [
{
xtype: "textfield",
fieldLabel: "field3"
},
{
xtype: "textfield",
fieldLabel: "field4"
}
]
}
],
activeTab: 0
}
],
buttons: [
{
text: "Button1"
},
{
text: "Button2"
}
]
};
var formPanel = new Ext.form.FormPanel(formPanelConfig);
var winConfig = {
items: [formPanel],
layout: "fit",
width: 600,
height: 200
};
var win = new Ext.Window(winConfig);
win.setPosition(0,0);
win.show();
});
if I remove the padding line
its OK
defaults: {bodyStyle: "padding:10px", autoHeight: true},
in the meantime I have found another solution:
setting
bodyStyle: "padding:10px"
on the tabpanel itself
(not on the child panels)
this seems to have the same effect
#If you have any other info about this subject , Please add it free.# |