ExtJs2.0 does not seem to support radio button groups, so two radio button boxes with the same name are used to implement the radio button group
var radio1 = new Ext.form.Radio({boxLabel:'male',name:'sex',id:'yes' ,inputValue:'0',width : 150, height : 20});
var radio2 = new Ext.form.Radio({boxLabel:'女',name:'sex',id:'no',inputValue:'1' , width : 150, height : 20});
//Gender configuration FieldSet
var fieldSet = new Ext.form.FieldSet({
title: 'Gender Configuration',
autoHeight: true,
## width : 350,
## labelAlign :
'right' ,## labelwidth : 110,
bodyStyle :
'padding:5px 5px 0' ,
layout:
'column', items : [{
## columnWidth : .5,
# items:radio1 //
radio1 must be written in separate
items, otherwise the effect displayed on the page is that the circles of the two radio button boxes are in the front, and the descriptions of the two radio button options are in the back## },
{
items: radio2
## }]
});
var fp = new Ext.FormPanel({
id: 'sex_mode',
labelWidth: 110,
waitMsg: 'Submitting, please wait...',
frame: true,
## width : 380,
## autoHeight :
true,## layout:
'column', items : [fieldSet]
});
var
winKey = new Ext.Window({ id:
"sex_win", title:
'[Gender] Maintenance', autoHeight :
true,// 320, width : 400,
closeAction:
'hide',## closeAction:
false,## IconCls : 'add'
, modal :
true
,## buttons : [{
text:
'Submit'
,
id: 'button'
,
## handler: function
() {
var sex = fp.form.findField("sex").getGroupValue();
## if (sex != '' && sex != undefined && sex != null ){
## ''
, //How to configure gender
## # 'Submitting data, please wait...'
,
Because 'Prompt message',action.result.msg);
## ,
##function
(form, action) {## Message ',
"The updated gender is wrong! "
);}
});
## unch #{ Hs.util.Msg('Prompt message'
, 'Please select gender ! '# ,## items : [fp]##});
The above is the detailed content of Ext.form.Radio horizontal arrangement layout in ExtJs2.0. For more information, please follow other related articles on the PHP Chinese website!