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

时间:2011-09-13 07:21:39

标签: javascript extjs autocomplete combobox extjs4

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

{
    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的行为相同。

提前致谢。

2 个答案:

答案 0 :(得分:2)

从单步执行来看,似乎没有任何对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();
            }
        }
    }

});

希望这有帮助!

答案 1 :(得分:0)

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

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

但不可否认,希望Sencha将很快在4.1中解决这个问题。