PDA

View Full Version : Form in tab



diclofoss
22 Feb 2009, 2:40 AM
Hello!

I have dinamic creating tab and want to locate on this form from example.

But I have 2 problems:

all background has white theme
padding-left and padding-top has 0px; (to close from tab panel)Please guide me:

Here is my code:


var MAIN_OBJECT = new Ext.form.FormPanel({
title:'Check/Radio Groups',
baseCls: 'x-plain',
layout:'absolute',
url:'save-form.php' (https://extjs.com/forum/'save-form.php'),
defaultType: 'textfield',
bodyStyle: 'padding:10px',
closable:true,
items: [{
x: 0,
y: 5,
xtype:'label',
text: 'Send To:'
},{
x: 60,
y: 0,
name: 'to'
},{
x: 0,
y: 35,
xtype:'label',
text: 'Subject:'
},{
x: 60,
y: 30,
name: 'subject'
},{
x:0,
y: 60,
xtype: 'textarea',
name: 'msg'
}]
});


Thx.

walldorff
22 Feb 2009, 2:49 AM
Please tell us exactly what it is you want.
What margins, what color, what padding, what?

http://extjs.com/learn/Ext_Forum_Help
Play with some CSS, you'll eventuelly find out :)

diclofoss
22 Feb 2009, 3:03 AM
Please tell us exactly what it is you want.
What margins, what color, what padding, what?

http://extjs.com/learn/Ext_Forum_Help
Play with some CSS, you'll eventuelly find out :)

Hello!

Please see screenshoot and keep in mind that in my code i have specified:

bodyStyle: 'padding:10px',


http://www.digitalink.ru/research/ex/sceenshoot.jpg

Actualy I want to have padding:10px from all sides
And theme something like:

http://www.digitalink.ru/research/ex/sceenshoot1.jpg

Maybe I need to wrap formPanel by Ext.panel?

Animal
22 Feb 2009, 3:32 AM
Configure your FormPanel with



{
cls: 'x-panel-mc',
bodyStyle: { padding: '5px' }
...
}


And to get the field sizing, look at the layout, and the anchor config.

Animal
22 Feb 2009, 3:33 AM
Don't use absolute layout. It's an HTML page.

diclofoss
22 Feb 2009, 4:00 AM
Hello!
Thank you very much. Now I understand where i need to dig.

In current case code looks like:



var form = new Ext.form.FormPanel({
url:'save-form.php' (http://www.extjs.com/forum/'save-form.php'),
defaultType: 'textfield',
layout:'fit',
items: [
{
xtype:'htmleditor',
name: 'msg'
}]
});

var MAIN_OBJECT = new Ext.Panel({
title:'????????? ???',
id:'<?echo $id."-tabpanel";?>',
plain:true,
buttonAlign:'center',
bodyStyle: 'padding:10px',
layout: 'fit',
cls: 'x-panel-mc',
closable:true,
items: form,
buttons: [{
text: 'Send'
},{
text: 'Cancel'
}]
});

walldorff
22 Feb 2009, 4:14 AM
Maybe this helps a bit:



var MAIN_OBJECT = new Ext.form.FormPanel({
title:'Check/Radio Groups',
cls: 'x-panel-mc',
layout:'fit',
url:'save-form.php',
defaultType: 'textfield',
labelWidth:60,
bodyStyle: { padding: '10px' },
defaults:{anchor:'-24'},
closable:true,
items: [{
name: 'to',
fieldLabel: 'Send To'
},{
name: 'subject',
fieldLabel: 'Subject',
},{
xtype: 'textarea',
hideLabel:true,
name: 'msg',
height:200 // or any other number

}]
});

You want to hide the label for the textarea. The anchor -24 is for the quicktips of the validation.

diclofoss
22 Feb 2009, 6:43 AM
Thank you very much. This is my next step.