EXT-JS组合框'当动态加载数据时,s存储在扩展后重置

EXT-JS combo-box's store reset after expand when data is loaded dynamically

本文关键字:存储 扩展 数据 组合 加载 动态 EXT-JS      更新时间:2023-09-26

我想动态地将项目添加到组合框项目中。这就是它的定义:

{
      xtype: 'combobox',
      id: 'tierTypeCB',
      fieldLabel: 'Tiers'' type',
      labelWidth: 70,
      editable: false,
      valueField: 'type',
      displayField: 'type',
      store: Ext.create('Ext.data.Store',{
          fields: ['type'],
          data: []
      })
}

在代码的其他部分,我有这个函数,它应该添加项目:

onGetTiersSuccess: function(response) { // this is a 'success' function of an AJAX request
    var decodedResponse = Ext.decode(response.responseText);
    var tierTypeCB =  Ext.getCmp('tierTypeCB');
    var tierTypesStore = tierTypeCB.getStore();
    for (var tierType in decodedResponse){
        tierTypesStore .add({type: tierType});
    }
}

问题是,当下拉列表打开时,它是空的。我发现,我的代码将数据放入组合框的存储区,但一旦组合框展开,存储区就会清空。我已经用chrome的控制台做了更多的测试。我注释掉了"onGetTiersSuccess"函数。相反,我只是在控制台中键入Ext.getCmp('tierTypeCB').getStore().add({type: 'abc'})如果我打开组合框,它是空的。但是,如果我首先打开组合框(在添加该项目之前),然后才添加该项目,那么一旦我再次打开组合框,我就可以在那里看到我添加的项目。似乎在打开组合框之前将项目添加到组合框中,会在组合框打开后"重置"其存储。在添加项目之前,我试图通过调用Ext.getCmp('tierTypeCB').expand()Ext.getCmp('tierTypeCB').collapse()来绕过它,但这没有帮助。我也尝试过不在我定义的地方设置组合框的存储,而是创建一个存储对象,然后将其绑定到组合框(使用bindStore()命令),这也没有帮助。

在这一点上,我一无所知,所以如果你有任何想法可以帮助我,我将不胜感激

谢谢,eRez

您应该能够使用组合的lastQuery配置来防止存储在首次扩展时重新加载。

{
    xtype: 'combobox',
    lastQuery: '',
    id: 'tierTypeCB',
    fieldLabel: 'Tiers'' type',
    labelWidth: 70,
    editable: false,
    valueField: 'type',
    displayField: 'type',
    store: Ext.create('Ext.data.Store',{
        fields: ['type'],
        data: []
    })
}

请参阅此处的文档:http://docs.sencha.com/extjs/4.2.1/#/api/Ext.form.field.ComboBox-property-lastQuery

queryMode属性设置为local。现在的情况是,在你尝试扩展组合框之前,不会创建空的商店。默认情况下,queryMode属性为remote。将其设置为local应该可以解决此问题,因为它将在创建组合框时加载存储。