原文：Ext JS: Generating a Checkbox Group from a Store

Ext JS的checkbox group可以用来将复选框组合成一个单一的逻辑字段。由于复选框时不时需要动态的从Store中生成，因而，如果将store绑定到扩展类，就最好不过了。以下是第一次尝试：

Ext.define('Ext.ux.CheckboxStoreGroup', {extend: 'Ext.form.CheckboxGroup',alias: 'widget.checkboxstoregroup',config: {store: null,labelField: 'label',valueField: 'id',checkedField: 'checked',columns: 3,boxFieldName: 'mycheckbox'},applyStore: function(store) {if (Ext.isString(store)) {            return Ext.getStore(store);} else {            return store;}},updateStore: function(newStore, oldStore) {if (oldStore) {store.removeEventListener('datachanged', this.onStoreChange, this)}newStore.on('datachanged', this.onStoreChange, this);},onStoreChange: function(s) {Ext.suspendLayouts();        this.removeAll();        var vField = this.getValueField();        var lField = this.getLabelField();        var cField = this.getCheckedField();        var fName = this.getBoxFieldName();        var rec = null;        for (var i=0; i<s.getCount(); i++) {rec = s.getAt(i);            this.add({xtype: 'checkbox',inputValue: rec.get(vField),boxLabel: rec.get(lField),checked: rec.get(cField),name: fName});}Ext.resumeLayouts(true);}, initComponent: function() {this.callParent(arguments);        this.on('afterrender', this.onAfterRender);},onAfterRender: function() {   if (this.getStore().totalCount) {            this.onStoreChange(this.getStore);}}
});123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960

测试地址：
https://fiddle.sencha.com/#fiddle/i51