PDA

View Full Version : How to make the textbox close to the checkbox when use checkboxgroups component?



yukohn
19 Dec 2010, 11:01 PM
How to make the textbox close to the checkbox when use checkboxgroups component?
I wish he becomes [after.jpg] from [befor.jpg]. Someone help me to make automatically close textbox to checkbox with override checkboxgroups component?

[befor.jpg]
23894
[after.jpg]
23893

var checkGroup = {
xtype: 'fieldset',
title: 'Checkbox Groups',
autoHeight: true,
layout: 'form',
collapsed: false, // initially collapse the group
collapsible: false,
items: [{
xtype: 'checkboxgroup',
fieldLabel: 'Checkbox with text',
columns: 3,
items: [
{boxLabel: 'Item 1', name: 'cb-cust-1'},
{boxLabel: 'Item 2', name: 'cb-cust-2'},
{boxLabel: 'Item 3', name: 'cb-cust-3'},
{boxLabel: 'Item 4', name: 'cb-cust-4'},
{boxLabel: 'Other', name: 'cb-cust-5'},
{xtype: 'textfield',name: 'yukohn', anchor: '90%'}
]

}]
};

Condor
19 Dec 2010, 11:30 PM
You could if you replaced CheckboxGroup with a Container with column layout, e.g.

{
xtype: 'container',
fieldLabel: 'Checkbox with text',
anchor: '100%',
layout: 'column',
defaultType: 'checkbox',
items: [
{boxLabel: 'Item 1', name: 'cb-cust-1', columnWidth: .33},
{boxLabel: 'Item 2', name: 'cb-cust-2', columnWidth: .33},
{boxLabel: 'Item 3', name: 'cb-cust-3', columnWidth: .34},
{boxLabel: 'Item 4', name: 'cb-cust-4', columnWidth: .33},
{boxLabel: 'Other', name: 'cb-cust-5', columnWidth: .2},
{xtype: 'textfield', name: 'yukohn', columnWidth: .47}
]
}
(but you will loose the advantages of CheckboxGroup)

yukohn
20 Dec 2010, 6:17 AM
Dear Condor:
Thanks for your solution.I found your code simpler than my.
It makes me very surprised.