ExtJs实现复选框组Checkboxgroup单勾选及复选框组对多个复选框组跨控件全选

ExtJs实现复选框Checkboxgroup单勾选及跨控件全选

     由于项目的需要，我们要将EXT的控件Checkboxgroup复选框组改造成但勾选，并且实现一个复选框组控制其他多个复选框组的全选，以下是关于如何实现的代码片段。

1.创建CheckboxGroup对象

1，新建空的EOS6.5的工程，新建com.towngas.tcis. gridlock构件包；

2，在com.towngas.tcis.gridlock构件包的“展现”节点下的“页面资源”节点中创建一个文件夹，命名为gridlock；

3，在新建的文件夹中创建gridlockUi.js文件，gridlockEv.js文件。

4，在gridlockUi.js文件中创建对象：

varfieldAllSelect =  newExt.form.CheckboxGroup({

                 xtype: 'checkboxgroup',

                 fieldLabel: '全选',

                 itemCls: 'x-check-group-alt',

                 // Put all controls in a single column with width 100%

                 columns : 8,

                 items: [

                      {boxLabel: '全选1', name: '0',checked: false,

                      }},

                      {boxLabel: '全选2', name:'1',checked: false,

                     }},

                      {boxLabel: '全选3', name:'2',checked: false,

                      }},

                      {boxLabel: '全选4', name:'3',checked: false,

                      }},

                      {boxLabel: '全选5', name:'4',checked: false,

                      }}

                 ]

              });

 

 

 

2.扩展CheckboxGroup的单选方法

       对创建的CheckboxGroup对象扩展增加方法singlecheck，参数为CheckboxGroup对象以及，复选框的选项items的索引，内容如下：

singlecheck: function (ChkGrp, index) {

         if (ChkGrp.items.itemAt(index).checked) {

            for (var i = 0; i <ChkGrp.items.length; i++) {

                 if (i != index) {

                    if(ChkGrp.items.itemAt(i).checked) {