[2.2] RadioGroup, boxLabel width

[LouiSe]

Thanks for the RadioGroup feature guys!

So there is three little problems:
- when rendering with a long (longer than section width) boxLabel, the space between radios isn't increased
- fieldLabel is missing for TextField in "layout: column"
- TextField width ignored when a long boxLabel presents

Examples:

var contractingAuthorityTypeOther = new Ext.form.TextField({
	fieldLabel: 'Description',
	disabled: true,
	width: 200,
	name: 'contractingAuthorityTypeOther'
})

var F02_N01_2 = new Ext.form.FieldSet({
    ...
    layout: 'column',
    defaults: {
        columnWidth: '.5',
        border: true,
        width: TEXT_INPUT_WIDTH
    },
    ...

   items: [{
        xtype: 'radiogroup',
	allowBlank: false,
	hideLabel: true,
	vertical: true,
        columns: 1,
        items: [{
            checked: false,
            boxLabel: LANG_FORM_F02CONTRACT_N01_2_1_1,
            name: 'contractingAuthorityType',
            inputValue: '1'
        },
        ...
        contractingAuthorityTypeOther
	]

Just like the left section on attached image (radiogroup_boxlabel.jpg).

[Condor]

Issue 1:
No comment.

Issue 2:
This is by design. A field doesn't render a fieldLabel, the container with layout:'form' does.

Use:

{
  xtype: 'panel',
  layout: 'form',
  items: contractingAuthorityTypeOther
}

Issue 3:
Doesn't apply when using code from issue 2.

[LouiSe]

Thanks for your answer, but Issue #1 is most important for me!

Is this a by-design effect, or a bug in current Ext2.2 release?

Any workaround?

[Condor]

You could use this workaround:

<style type="text/css">
.x-form-check-group .x-form-check-wrap,
.x-form-radio-group .x-form-radio-wrap {
	height: auto;
}
</style>

[LouiSe]

Thanks again! Works perfectly.

[sothea]

This is my code:
items:[{
xtype: 'radiogroup',
id: 'exp_type',
columns: 4,
width:850,
height:30,
cls:'radiogroup',
items: [new Ext.form.Radio({
boxLabel: 'computer ',
name: 'base',
inputValue:'sig',
width:80,
cls:'test',
checked:true,
id:'radio_sig'
}),
new Ext.form.Radio({
boxLabel: 'software ',
name: 'base',
width:80,
inputValue:'con'
}),
new Ext.form.Radio({
boxLabel: 'Export courrier ',
name: 'base',
inputValue:'cour'
}),
new Ext.form.Radio({
boxLabel: 'computer and sofeware ',
name: 'base',
width:150,
inputValue:'mail'
})]
}]

It is not work for attribute "width" and "cls".

[bsoymine]

With this answer, I also overcome my problem.

modern bar stools | modern decor