PDA

View Full Version : Table Layout inside a Tab



ArchBytes
11 Nov 2009, 12:21 PM
I'm not quite sure how to get the layout working for my Tabs especially with the table layout. I have several different fields with different lengths, but every time I try to add some structure to it using the table layout it doesn't seem to render rightly.

I can't just use column lay out cause some rows will have three fields in it and some just one. Need a little advice on this one.

basically this is how my code looks like.



xtype: 'tabpanel',
plain: true,
activeTab: 0,
height: 335,
defaults: {
bodyStyle: 'padding:10px'
},
items: [{
title: 'Additional Contact Details',
layout: 'form',
defaults: {
width: 230
},
defaultType: 'textfield',
items: [{
fieldLabel: 'Phone',
name: 'acd_phone'
}]
}, {
title: 'Personal Details',
layout: 'form',
autoScroll: true,
items: [{
layout: 'table',
layoutConfig: {
columns: 3
},
defaults: {frame:true,layout: 'form'},
items: [{
colspan: 3,
items:[{
xtype: 'textarea',
fieldLabel: 'Home Address',
name: 'pd_address',
height: 30,
}]


}]
but here's what it looks like:

http://i220.photobucket.com/albums/dd21/ArchBytes/11-11-200911-14-48PM.pnghttp://i220.photobucket.com/albums/dd21/ArchBytes/formpix.png
http://i220.photobucket.com/albums/dd21/ArchBytes/formpix.png
http://i220.photobucket.com/albums/dd21/ArchBytes/formpix.png
problems:

1. I can't seem to get the first table pan to be as long as the tab is, it doesn't seem to follow the colspan code I add.

2. the fieldLabel should be aligned with the field rather than on top of it

Any advice would be appreciated :)

Thanks,
Emily

Ash2009
11 Nov 2009, 1:32 PM
the fieldLabel should be aligned with the field rather than on top of it


try giving
labelAlign : "left"

ArchBytes
11 Nov 2009, 11:04 PM
Thanks the labelAlign worked for the label now my only problem is the first, to get the table match the width of the tab, also it doesn't seem like the colspan is working..