extjs radiogroup赋值和取值
类别:Web前端 浏览量:2065
时间:2013-12-8 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);//把否选中
}
}]]
});
您可能感兴趣
- extjs XTemplate的实例
- Extjs menu菜单的简单用法
- extjs中Toolbar工具栏
- extjs radiogroup赋值和取值
- extjs中apply和applyIf的用法
- extjs anchor 锚点布局
- extjs Border边框布局
- ExtJs中怎么上传文件
- ExtJs 中Viewport 的使用
- extjs card卡片式布局
- Extjs中文乱码
- extjs accordion折叠布局
- extjs实现树形下拉框
- extjs中treepanel例子
- extjs tabPanel的用法
- extjs多选下拉框
- 学会这26种姿势,你就可以和兵哥哥切磋了(你就可以和兵哥哥切磋了)
- 吴彦祖陈冠希 恩怨 ,失去曾让他流泪的女友,终遇走过18年真爱(吴彦祖陈冠希恩怨)
- 痴情男神 吴彦祖 与妻子恋爱8年,结婚10年,家庭幸福美满(痴情男神吴彦祖)
- 成功破圈,小牛电动SQi强势开 跨(小牛电动SQi强势开)
- 挑战新国标电自天花板,九号机械师MMAX 110P深度体验(挑战新国标电自天花板)
- 《满江红》不要只当电影看,学生应该这样做(满江红不要只当电影看)
热门推荐
- Linux ls命令的使用(Linux ls命令的使用)
- nginx事件模型有几种(Python实现监控Nginx配置文件的不同并发送邮件报警功能示例)
- laravel模型使用技巧(提高Laravel应用性能方法详解)
- python字符串相似度匹配(Python实现字符串匹配的KMP算法)
- 前端树结构数据很多怎么展示(amazeui树节点自动展开折叠面板并选中第一个树节点的实现)
- SQLite数据类型
- python数组矩阵操作(Python矩阵和Numpy数组的那些事儿)
- dedecms添加底部链接(详解如何修改织梦模板dedeCMS友情链接为下拉式)
- css中有几种样式表(深入浅出学习层叠样式表--css推荐)
- sqlserver删除表的第一行数据(sql server删除前1000行数据的方法实例)