ComboBox显示为空 - Ext.JS 4

时间:2016-07-22 08:00:38

标签: javascript extjs

我试图在组合框中显示值如下:

Ext.define('Pgmtems.view.combo.DepoTurCombo', {
            extend : 'Ext.form.field.ComboBox',
            alias : 'widget.depoturcombo',
            fieldLabel : 'Depo Cinsi',
            displayField : 'aciklama',
            valueField : 'value',
            typeAhead : true,
            forceSelection : true,
            enableKeyEvents : true,
            emptyText : '-Depo Cinsi-',
            editable : false,
            labelWidth : 70,

            constructor : function(cfg) {
                console.warn(cfg.xtype, " constructor arld.");
                var me = this;
                Ext.apply(this, cfg);
                var store = Ext.create('Ext.data.Store', {
                            autoLoad : true,
                            fields : ['value', 'aciklama'],
                            data : [[3, "TL"], [2, "YTL"], [1, "ETL"]]
                        });
                Ext.apply(this, {
                            store : store
                        });
                this.callParent(arguments);
            },
            initComponent : function() {
                console.log('DepoTurCombo initComponent');
                this.trigger1Cls = 'x-form-clear-trigger';
                this.trigger2Cls = 'x-form-arrow-trigger';
                this.callParent(arguments);
            },
            onTrigger1Click : function() {
                this.clearValue();
            }
        });

但是,它没有显示组合框值。正如你所看到的,Depo Cinsi值是空的(实际上我可以看到3个项目,但它们的名字不会出现)。

关于如何解决这个问题的任何想法?

enter image description here

1 个答案:

答案 0 :(得分:3)

使用Ext.data.ArrayStore代替Ext.data.Store

  

使用Array数据创建Ext.data.Store的小助手类更容易。 ArrayStore将自动配置为Ext.data.reader.Array

工作示例:https://fiddle.sencha.com/#fiddle/1e2p

如果您想在不使用Ext.data.Store的情况下使用Ext.data.reader.Array,则需要传递以下数据:

data: [{value: 3, aciklama: "TL"}, {value: 2, aciklama: "YTL"}, {value: 1, aciklama: "ETL"}]