ExtJs组合在商店页面加载时失去选定的值

时间:2013-01-07 17:11:38

标签: extjs extjs4 extjs4.1

我有一个带有JsonStore和queryMode的ExtJS 4.1组合框:'remote',具有分页和过滤功能,如下所示:

...
queryMode:      'remote',
allowBlank:     true,
forceSelection: true,
autoSelect:     false,
pageSize:       25,
typeAhead:      true,
minChars:       2,
...

当我在此组合框中加载带有保存值的表单时,我加载商店将保存的值作为查询(过滤)参数传递,以确保所选值肯定在返回的记录中,然后我将该值设置为组合选择的值:

    mycombo.getStore().load({
        params: {
            query: displayField
        },
        scope: {
            field: combo,
            valueField: valueField,
            displayField: displayField
        },
        callback: function(records, operation, success) {
            this.field.setValue(this.valueField);
        }
    });

到目前为止,这么好,以上工作正常。问题是,如果用户然后单击下拉箭头为组合选择另一个值,则加载商店的第一页,删除所有先前选择的值,即使没有选择任何内容,先前选择的值也会丢失

此问题是通用的,与此问题非常相似: ExtJS paged combo with remote JSON store. Display selected value with paging 并可归纳为:

在具有远程存储和分页的ExtJS组合框中,当加载的页面发生更改时,选定的值将丢失。

我尝试为商店设置clearOnPageLoad: false,但每次加载新页面时,记录都会附加到列表的末尾。我希望这个参数可以缓存加载的页面,并在来回移动时显示正确的页面。

那么,关于如何在页面之间移动时保持所选值的任何想法?我想我可以手动创建一个带有所选值的记录,并在每次页面加载时将其附加到商店,直到选择了一个新值,但这听起来像是太费力的事情,而且非常基本。

3 个答案:

答案 0 :(得分:6)

我们最终联系了Sencha支持,因为我们有付费许可证。这就是我们回来的答案:


Ext.override(Ext.form.field.ComboBox, {
    onLoad: function() {
        var me = this,
            value = me.value;

        if (me.ignoreSelection > 0) {
            --me.ignoreSelection;
        }

        if (me.rawQuery) {
            me.rawQuery = false;
            me.syncSelection();
            if (me.picker && !me.picker.getSelectionModel().hasSelection()) {
                me.doAutoSelect();
            }
        }

        else {

            if (me.value || me.value === 0) {
                if (me.pageSize === 0) { // added for paging; do not execute on page change
                    me.setValue(me.value);
                }
            } else {


                if (me.store.getCount()) {
                    me.doAutoSelect();
                } else {

                    me.setValue(me.value);
                }
            }
        }
    }
});

答案 1 :(得分:2)

有同样的问题,'pruneRemoved:false'不起作用(似乎只在网格中使用)。这是解决方案:

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

    // lastSelection is searched for records
    // (together with store's records which are searched in the parent call)

    findRecord: function(field, value) {
        var foundRec = null;
        Ext.each(this.lastSelection, function(rec) {
            if (rec.get(field) === value) {
                foundRec = rec;
                return false; // stop 'each' loop
            }
        });
        if (foundRec) {
            return foundRec;
        } else {
            return this.callParent(arguments);
        }
    }
});

希望它没有负面的副作用。我已经测试了一下它似乎没问题。

答案 2 :(得分:0)

我在extjs 6.0.1中遇到了这个问题。

我发现一项可能对其他人有帮助的工作。

我在onLoad上使用override来将组合中的选定记录添加到商店中,然后再调用基于onLoad。

这样做是因为如果所选记录在正在查看的页面中,则组合足够智能,无法清除选择。换句话说,在您翻页时清除选择的原因是因为所选记录不在您正在查看的页面中。

onLoad: function (store, records, success)
{
    var selection = this.getSelection();

    if (selection)
    {
        records.unshift(selection);
        store.insert(0, records);
    }

    this.callParent(arguments);
}