EXTJS4,组合框,多选,需要VALUE字段以突出显示从DB返回的ALL

时间:2012-08-12 15:04:25

标签: extjs combobox extjs4 multi-select

使用EXTJS v4,我想更新我所拥有的多选组合框的VALUE字段,以及从我的远程查询返回的所有记录。在我的情况下,我想更新多选“值”字段而不是“valueField”条目,并突出显示列表中从组合列表的数据库查询返回的值。对于组合框,如果您将组合设置为使用以下配置条目运行:

displayField:'TABLENAME', valueField:'TABLENAME', value:['table1','table2','table5'],

然后当你打开组合创建组合时,你会看到这3个条目突出显示。

我想进行远程调用,获取返回值的列表,然后将它们传递回组合框,以便它们在组合框中显示为突出显示的条目。

这是我到目前为止所做的:

[code]
Ext.Ajax.request({
    url     : 'app/store/dbcall/target/GG/table_list_containing_target_svc.php',
    params  : { groupflavor_sn: theGroupFlavor_sn, familyName: familyName },
    method  : 'POST',
    success : function(response, theRecord) {
        var res = Ext.JSON.decode(response.responseText);
        var returnedTablesData = res.data;

        // reurned values are either 'blank', or a list of tablenames formatted as JSON.
        // JSON responses will look like this: 
                // {"data":[{"TABLENAME":"TABLE_A1"},{"TABLENAME":"TABLE_A1B"},{"TABLENAME":"TABLE_A5"}]}

        //  combobox object:
        /*
            var msForm = Ext.widget('form', {
                title: 'Tables found for ' + selectedFamily,
                //width: 385,
                height: 150,
                bodyPadding: 10,
                id: 'msForm',
                layout: 'fit',
                items:[{
                    xtype: 'combobox',
                    id: 'myTablesComboId',
                    name: 'myTargets',
                    maxHeight: 150,        
                    width: 210,
                    multiSelect: true,
                    emptyText : "Select targets",
                    store: 'TableComboStore',
                    displayField: 'TABLENAME',
                    valueField: 'TABLENAME',
                    value: ['TABLE_A1', 'TABLE_A10B', 'TABLE_A5'],     //<- this is what will be highlighted in the combo list
                    forceSelection: false,
                    editable: false,
                    queryMode: 'local',
                    ddReorder: true,
                    triggerAction: 'all',
                    listeners: {
                        'click': function() {
                            if (selectedFamily) {  
                                console.log('family selected, and button clicked');
                            }
                        }
                    },
                    listConfig: {          
                        getInnerTpl: function(displayField) {                              
                            return '<tpl for="."><div><img src="' + Ext.BLANK_IMAGE_URL + '" ' + 'class="ux-checkboxlistcombo-icon">{' + (displayField || 'text') + ':htmlEncode}</div></tpl>';
                        }
                    }
                }]
            })      
        */

        // Post value to field
        Ext.getCmp('theTargetLabel').setValue(theGroupFlavor);

        if (res.data === 'blank') {
            console.log("res.data === 'blank'");

            // Entry is found in the database, so clear all values, and ask to resend
            var theTableCombo = Ext.getCmp('myTablesComboId');
            Ext.getCmp('theTargetLabel').setValue(' ');
           theTableCombo.clearValue();
        } 
       else {
            // list of available tables returned as JSON
            // populate list returned into the new table combo, and update with the existing list of tables
            // values returned will be HIGHLIGHTED and the checkbox next to value will be CHECKED in the listing

            var theTableCombo = Ext.getCmp('myTablesComboId');
            var store = theTableCombo.getStore();

            theTableCombo.setValue(returnedTablesData); // this works partially, to return all records found, but they are not highlighted in the combo list
            //theTableCombo.setValue(store.getAt(0).get('TABLENAME')); // this works partially -  record is highlighted in combo list, but only returns the first record
        }

});

[/code]

正如您所看到的那样,当我们到达'else'语句时,会有一个表格列表,我可以回发给组合。但我得到了返回的列表,但它们只显示在组合文本字段中,并且在打开组合时不会突出显示值。

如果我使用--TableCombo.setValue(store.getAt(0).get('TABLENAME')); - 我能够检索返回的第一条记录并在组合中突出显示该记录,但只能记录第一条记录。我希望返回的所有记录都显示在组合中,作为突出显示的条目。

1 个答案:

答案 0 :(得分:1)

鉴于您已经在选择单个记录的工作解决方案,以下方法不会起作用:

var iValues = [];

store.each( function( aRecord ) {
    iValues.push ( aRecord.get('TABLENAME') );
}, this);

theTableCombo.setValue ( iValues );

我不知道有任何更好的方法(比如没有每个)。