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) {