ExtJs4 - 自动完成组合框不显示空文本

Question

我有一个具有以下配置的组合框。

{
    fieldLabel:'Service',
    xtype:'combo',
    displayField: 'srvcDesc',
    store: storeServiceCodeVar,
    valueField:'srvcCD',
    id:'serviceCodeId',
    name:'serviceCodeName',
    queryMode: 'remote',
    queryDelay:100,
    typeAhead: true,
    minChars:0,
    hideTrigger:true,
    forceSelection:true,
    maxHeight:23,
    deferEmptyText:false,
    autoSelect:true,
    fieldStyle:'text-transform:uppercase',
    listConfig: {
        loadingText: 'Loading...',
        // Custom rendering template for each item
        getInnerTpl: function() {
            return '<table width="200px"><tr><td height="5"></td></tr><tr valign="top"><td>Code:{srvcCD}</td></tr><tr><td height="2"></td></tr><tr valign="top"><td>Description:{srvcDesc}</td></tr><tr><td height="5"></td></tr></table>';
        },
        emptyText:'No Values Found'
    }
}

问题是，当服务器没有返回数据时，emptyText（有值 - 未找到值）可能会显示一毫秒，然后消失。我希望它保留在那里直到下一个查询（如果被触发）。怎么可能呢。我尝试过 deferEmptyText 但没有运气。

有人可以解释一下吗？我使用的是 ExtJS 4，IE9 和 Mozilla 中的行为是相同的。

提前致谢。

Answer 1

从单步查看源代码来看，似乎没有任何对 listConfig.emptyText 的引用用于确定是否将元素的高度设置为非零的数字。

我最终覆盖了 Ext.form.field.ComboBox 从 Ext.form.field.Picker 继承的 alignPicker() 函数，并添加了对 listConfig.emptyText 的检查>。

Ext.override(Ext.form.field.ComboBox, {

    alignPicker: function() {
        var picker, height;

        if (this.isExpanded) {
            // Get the picker component.
            picker = this.getPicker();

            if (this.matchFieldWidth) {
                // Set the default height to null, since we don't 
                // automatically want to have the height changed.
                height = null;

                // If our store exists, but the count is zero
                // and we've got no emptyText defined...
                if (picker.store && 
                    picker.store.getCount() === 0 && 
                    Ext.isEmpty(this.listConfig.emptyText)) {
                    // ...we set the height to zero. 
                    height = 0;
                }

                // Set the size of the picker component.
                picker.setSize(this.bodyEl.getWidth(), height);
            }

            if (picker.isFloating()) {
                this.doAlign();
            }
        }
    }

});

希望这有帮助！

Answer 2

这里有一句警告。我使用的是 ExtJs 4-0-6，似乎现在 Ext.form.field.ComboBox 中有一些代码，并且它不再仅仅依赖于从 Ext 继承方法。 field.form.Picker。

因此，上面的代码现在应该直接覆盖 Ext.field.form.Picker 中的代码，而不是 ComboBox 中的代码。

但不可否认的是，希望 Sencha 很快就能在 4.1 中自行修复这个问题。