如何从SQL查询填充复选框组

时间:2018-11-30 16:18:31

标签: javascript jquery extjs

我有一个查询,该查询返回表中的所有列标题。 我想用查询返回的值填充组中每个复选框的值框标签。 id节点将是值,文本节点将是复选框标签。

查询是由商店加载事件中的ActionName发起的。

这是我的代码

true

这是查询中的xml

{
            xtype       : 'checkboxgroup',
            fieldLabel  : 'Column Names',
            id          : 'chkColumnNames',
            itemId      : 'chkColumnNames',
            cls         : 'x-check-group-alt',
            // Distribute controls across 5 even columns, filling each row
            // from left to right before starting the next row
            columns: 5,
            store          : Ext.create('Ext.data.Store', {
                model    : 'Personnel.ART.String.ChoiceList',       
                autoLoad : true,
                sorters: [{
                    property: 'text',
                    direction: 'ASC'
                }],
                proxy    : {
                    type     : 'ajax',
                    url      : IXYZ.portal.path + 'IXYZDBService.asmx/jsonSQLActions',
                    actionMethods : {read : 'POST'},
                    extraParams : {
                        AppAcronym      : IXYZ.application.acronym, 
                        WFAcronym       : IXYZ.workflow.acronym,
                        Process_id      : -1,
                        ActionName      : 'ART.SELECT.ADHOC.COMBINED_PERSONNEL.COLUMN.NAMES',
                        suppressLog     : true,
                        tokenProcessing : 'False'
                    },
                    reader   : {type : 'xml', record : 'row'}
                },
                listeners      : {
                    load: function(store, records, successful) {
                        columnNamesCheckbox = Ext.getCmp('chkColumnNames');
                        var columnNameItems = [];

                        for(var i = 0; i < records.length; i++) {
                             columnNameItems.push({id: records[i].data.id, boxLabel: records[i].data.text}); 
                        }
                    }
                }
            }),
            items: [

            ]
        }

1 个答案:

答案 0 :(得分:0)

这是对我有用的。由于我正在商店中运行代码,所以我按ID引用了复选框组,然后遍历记录并使用checkboxgroup.add填充了该复选框组

{
            xtype       : 'checkboxgroup',
            fieldLabel  : 'Column Names',
            id          : 'chkColumnNames',
            itemId      : 'chkColumnNames',
            cls         : 'x-check-group-alt',
            // Distribute controls across 5 even columns, filling each row
            // from left to right before starting the next row
            columns: 5,
            store          : Ext.create('Ext.data.Store', {
                model    : 'Personnel.ART.String.ChoiceList',       
                autoLoad : true,
                sorters: [{
                    property: 'text',
                    direction: 'ASC'
                }],
                proxy    : {
                    type     : 'ajax',
                    url      : ICWF.portal.path + 'ICWFDBService.asmx/jsonSQLActions',
                    actionMethods : {read : 'POST'},
                    extraParams : {
                        AppAcronym      : ICWF.application.acronym, 
                        WFAcronym       : ICWF.workflow.acronym,
                        Process_id      : -1,
                        ActionName      : 'ART.SELECT.ADHOC.COMBINED_PERSONNEL.COLUMN.NAMES',
                        suppressLog     : true,
                        tokenProcessing : 'False'
                    },
                    reader   : {type : 'xml', record : 'row'}
                },
                listeners      : {
                    load: function(store, records, successful) {
                    var checkboxgroup = Ext.getCmp('chkColumnNames');

                        for(var i = 0; i < records.length; i++) {
                             //ICWF.reports.itemArray.push({id: records[i].data.id, boxLabel: records[i].data.text});
                              checkboxgroup.add({
                                xtype: 'checkbox',
                                inputValue: records[i].data.id,
                                boxLabel: records[i].data.text,
                                //checked: rec.get(cField),
                                //name: 'fName'
                            });
                        }
                        debugger;
                    }
                }
            }),
            items: []
        }