ExtJs 动态RadioGroup的子项 [ Ext | RadioGroup | items ]

1.  实现代码
// Ext.form.RadioGroup扩展
Ext.override(Ext.form.RadioGroup, {
    getItems:
function (){
        
return   this .items;
    },
    setItems:
function (data){
        
this .items  =  data;
    }
});

function  RadioGroup(_name,fLable,_items,_columns)
{
    
// / <summary>
     // /
     // / 作 者:农民伯伯
     // / 邮 箱:over140@gmail.com
     // / 博 客:http://over140.cnblogs.com/
     // / 时 间:2009-7-23
     // / 描 述:Ext.form.RadioGroup封装
     //
     // / </summary>
     // / <param name="_name">name</param>
     // / <param name="fLable">fieldLabel</param>
     // / <param name="_items">items</param>
     // / <param name="_columns">columns</param>
     // / <returns>Ext.form.DateField</returns>
     var  rg  =   new  Ext.form.RadioGroup({
        name:_name,
        fieldLabel:fLable
    });
    
    
if (_columns != null )
        rg.columns 
=  _columns;
    //动态绑定        
    
var  items  =   new  Array();
    
if (_items  != null ){
        
for ( var  i  =   0  ;i < _items.length; i ++ )
        {
            items[i] 
=  {};
            items[i].name 
=  _name;
            items[i].boxLabel 
=  _items[i][ 0 ];
            items[i].inputValue 
=  _items[i][ 1 ];
            
if (_items[i].length  >   2 )
                items[i].checked 
=  _items[i][ 2 ];
        }
    }
    
    rg.setItems(items);
    
    
return  rg;
}
    代码说明:
      a).  首先需要将RadioGroup的items属性通过拓展暴露出来。
      b).  需要注意动态绑定子项部分的代码。

   2.  使用代码
             var  pnlZB  =   new  Ext.FormPanel({
                layout: 
' form ' ,
                frame:
true ,
                buttonAlign:
' center ' ,
                bodyStyle:
' padding:20px ' ,
                defaults:{
                    width:
200 ,
                    allowBlank:
false ,
                    blankText:
' 该项不能为空! '
                },
                labelAlign:
' right ' ,
                labelWidth:
150
                items:[
                    
new  RadioGroup( ' Gender ' , ' 性别 ' ,[[ ' ' , ' ' , true ],[ ' ' , ' ' ]])
                ],
                buttons:[{
                    text:
" 提  交 " ,
                    handler:
function (){
                            alert(Ext.encode(pnlZB.form.getValues()));
                    }
                },{
                    text:
" 取  消 " ,
                    handler:
function (){
                        pnlZB.form.reset();
                    }
                }]
            });
  代码说明:
    a).  如果要取选择的值,可以直接RadioGroup对象的实例.getValue().inputValue就能取到了。

补充

      1.    2009-7-28      如果出现js错误,比如setItems为空,请将Ext.override(Ext.form.RadioGroup...部分代码放入函数RadioGroup内,放在setItems前面就行;如果还报prototype错误,请将adapter\prototype\ext-prototype-adapter.js也加入工程,目录同样。

本文转自博客园农民伯伯的博客,原文链接:ExtJs 动态RadioGroup的子项 [ Ext | RadioGroup | items ],如需转载请自行联系原博主。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值