使用静态数据填充Extjs Combobox

时间:2012-10-30 15:32:03

标签: extjs extjs4

我的基类中有一个组合框,我只配置“fields”属性。像这样:

items: [
      comboText = Ext.create('Ext.form.ComboBox', {
                width: 150,
                padding: '0 20 0 0',
                displayField: 'label',
                store: Ext.create('Ext.data.Store', {
                    fields: [
                        {type: 'string', name: 'label'},
                        {type: 'string', name: 'fieldName'}
                    ]
                })
            }),
...]

如何只将数据属性传递给此组合? 我尝试了下面的代码但不起作用:

comboTest.store.loadData(value);

其中value包含如下数组:

 [
    {"label":"First name", "fieldName":"firstname"},
    {"label":"Birth date", "fieldName":"birthdate"}
 ]

没有错误,但组合框没有打开任何内容。

5 个答案:

答案 0 :(得分:10)

我使用以下方法开始工作:

   xtype:'combo',
   fieldLabel:'Division',
   name:'division',
   valueField: 'division',
   queryMode:'local',
   store:['A','B','C'],
   displayField:'division',
   autoSelect:true,
   forceSelection:true

我知道这个问题真的很旧,但万一有人来寻找一个开箱即用的答案;对我来说就是这样。

答案 1 :(得分:9)

试试这个配置:

       xtype:'combo',
       fieldLabel:'Division',
       name:'division',
       queryMode:'local',
       store:['A','B','C'],
       displayField:'division',
       autoSelect:true,
       forceSelection:true

另一个选项列在docs of the ComboBox

    // The data store containing the list of states
    var states = Ext.create('Ext.data.Store', {
        fields: ['abbr', 'name'],
        data : [
            {"abbr":"AL", "name":"Alabama"},
            {"abbr":"AK", "name":"Alaska"},
            {"abbr":"AZ", "name":"Arizona"}
            //...
        ]
    });

    // Create the combo box, attached to the states data store
    Ext.create('Ext.form.ComboBox', {
        fieldLabel: 'Choose State',
        store: states,
        queryMode: 'local',
        displayField: 'name',
        valueField: 'abbr',
        renderTo: Ext.getBody()
    });

答案 2 :(得分:1)

valueField必须

combobox。尝试在组合框中设置valueField

答案 3 :(得分:0)

有效:

{
    name: 'sample',
    xtype: 'combobox',
    allowBlank: false,
    emptyText: 'select ...',
    queryMode: 'local',
    itemId: 'sample',
    id: 'sample',
    displayField: 'name',
    valueField: 'name',
    forceSelection:true,
    store: ['B','C', 'A'],
    typeAhead: true
}

答案 4 :(得分:0)

代替使用loadData();

comboTest.store.loadData(value);

使用loadRawData();

comboTest.store.loadRawData(value);

如果感到困惑,请尝试fiddle