extjs radiogroup赋值和取值
extjs radiogroup赋值和取值在Extjs项目中通常要用到radiogroup 组件实现单选效果,由于ExtJs中RadioGroup中没有实现getValue和setValue方法,这就在使用过程中给radiogroup 组件赋值和取值带来麻烦,下面通过一个封装的方法介绍如何实现radiogroup赋值和取值
Ext.override(Ext.form.RadioGroup, {
getValue: function(){
var v;
if (this.rendered) {
this.items.each(function(item){
if (!item.getValue())
return true;
v = item.getRawValue();
return false;
});
}
else {
for (var k in this.items) {
if (this.items[k].checked) {
v = this.items[k].inputValue;
break;
}
}
}
return v;
},
setValue: function(v){
if (this.rendered)
this.items.each(function(item){
item.setValue(item.getRawValue() == v);
});
else {
for (var k in this.items) {
this.items[k].checked = this.items[k].inputValue == v;
}
}
}
});
//以上代码重载radiogroup组件,封装 getvalue方法 和 setvalue方法,以便radiogroup组件的取值和赋值
var record = Ext.data.Record.create([
{name: "rg",mapping:"rg"},
]);
var myNewRecord = new record ({rg:"2"});
var radiogroup= new Ext.form.RadioGroup({
fieldLabel : "radioGroup",
items : [{
boxLabel : '是',
inputValue : "1",
name : "rg",
checked : true
}, {
boxLabel : '否',
name : "rg",
inputValue : "2"
}]
});
var _formpanel = new Ext.form.FormPanel({
labelAlign : "right",
labelWidth : 150,
loadMask : true,
renderTo:Ext.getBody(),
frame : true,
defaults : {
width : 150
},
items : [radiogroup],
buttonAlign : "center",
buttons : [{
text : "获取radioGroup值",
handler : function() {
alert(_formpanel.getForm().getValues()["rg"] );
alert(_formpanel.getForm().getValues().rg);
alert(radiogroup.getValue());//三种方式获取所选值
}
},{
text : "Set radioGroup值2",
handler : function() {
radiogroup.setValue(2);//把否选中
}
},{
text : "Set radioGroup值1",
handler : function() {
_formpanel.findByType("radiogroup")[0].setValue(1);//把是选中
}
},{
text : "loadRecord赋值方式",
handler : function() {
_formpanel.form.loadRecord(myNewRecord);//把否选中
}
}]]
});