首页 文章

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

提问于
浏览
4

我有一个带有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,可以这样总结:

In an ExtJS combo box with a remote store and paging, selected values are lost when the loaded page changes.

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

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

3 回答

  • 0

    我们最终联系了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);
                    }
                }
            }
        }
    });
    
  • 6

    有同样的问题,'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

    我在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);
    }
    

相关问题