extjs中radiogroup的赋值和取值

由于ExtJs中RadioGroup中没有实现getValue和setValue方法,我们可以通过重载Ext.form.RadioGroup控件的方法实现getValue和setValue方法

 

实现代码为

 


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 radiogroup赋值和取值            http://www.studyofnet.com/news/248.html

 

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
`ComboTable` 是 ExtJS 的一个扩展组件,它是一个下拉框和表格的组合,可以通过表格来选择下拉框的选项。给 `ComboTable` 赋值的方法和普通的下拉框类似,只需要给下拉框和表格设置对应的数据即可。 示例代码如下: ```javascript // 创建一个 store,用来存储下拉框的选项 var store = Ext.create('Ext.data.Store', { fields: ['value', 'text'], // 设置 store 的字段 data: [ // 设置 store 的数据 {value: '1', text: '选项1'}, {value: '2', text: '选项2'}, {value: '3', text: '选项3'}, ] }); // 创建一个表格,用来显示下拉框的选项 var grid = Ext.create('Ext.grid.Panel', { store: store, // 设置表格的数据源 columns: [ {text: '值', dataIndex: 'value'}, {text: '文本', dataIndex: 'text'}, ], }); // 创建一个 ComboTable var comboTable = Ext.create('Ext.ux.form.ComboTable', { fieldLabel: '下拉框', // 下拉框的标签 store: store, // 设置下拉框的 store displayField: 'text', // 显示字段为 text valueField: 'value', // 值字段为 value tableConfig: { // 配置表格 columns: [ {text: '值', dataIndex: 'value'}, {text: '文本', dataIndex: 'text'}, ], }, }); // 将 ComboTable 添加到某个容器 // ... // 给 ComboTable 设置选值 comboTable.setValue('2'); ``` 在上述示例,我们首先创建了一个 `store`,用来存储下拉框的选项。接着创建了一个表格 `grid`,并将 `store` 设置为表格的数据源。然后创建了一个 `ComboTable`,并将 `store` 设置为下拉框和表格的数据源。设置了下拉框的显示字段和值字段,同时配置了表格的列。最后调用 `comboTable.setValue('2')` 方法给 `ComboTable` 设置了选值。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值