ExtJS ComboBox动态JSON更新

我发现了很多问题，解释为什么JSON存储未在Ext JS组合框中更新。ExtJS ComboBox动态JSON更新

我们制作了一个可重复使用的ExtJS组合框控件，这是它的源代码。

Ext.define('ReusableComboBox', { 
extend: 'Ext.form.field.ComboBox', 
alias: 'widget.Reusablecombobox', 
queryMode: 'local', 
forceSelection: true, 
valueField: 'id', 
displayField: 'displayField', 
autoLoad: false, 
initComponent: function() { 

    if (!this.store) { 
     var store = Ext.create('Ext.data.Store', { 
      autoLoad: this.autoLoad, 
      fields:['id', 'displayField', 'Id', 'Code', 'Description', 'IsIncluded', 'IsActive'], 
      proxy: { 
       type: 'ajax', 
       url: urlContent('validurl/getcodes'), 
       reader: { 
        type: 'json', 
        root: 'data' 
       } 
      } 
     }); 

     store.on('load', this.handler_StoreLoad, this); 

     Ext.apply(this, { 
      store: store 
     }); 

    } 
    this.callParent(); 
}, 

handler_StoreLoad: function (store, records, successful, options) { 

    addFieldsToList(records, function (item) { 
     item.data['id'] = item.data.Id; 
     item.data['displayField'] = item.data.Code + ' | ' + item.data.Description; 
    }); 
}, 

addFieldsToList: function(list, buildDisplayFieldFunc){ 
    if(list){ 
     for(var i=0, j=list.length; i<j; i++){ 
      buildDisplayFieldFunc(list[i]); 
     } 
     return list; 
    } 
}

}）;

当我动态添加另一个项目到comboBox存储时，comboBox不刷新。我尝试了以下事情。

以下尝试与在ComboBox

调用的removeAll（），clearValue（）在商店和功能使用bindStore（模型）重新初始化空白元素出现时，它涉及与空列表项目。
comboBox.store.reload（model）;

以下尝试添加新的项作为在ComboBox空白元件

VAR数据= [];新的Ext.data.Record（{id：options [0] .Id，displayField：options [0] .Code +'|'+ options [0] .Description}））; comboBox.store.add（data）;
comboBox.store.loadData（data，true）;

有没有人看到过我正在谈论的事情并与之挣扎？

在此先感谢您的帮助。

来源

2013-08-22 Sanjay Kumar

我想你的代码，并将其与以下变化工作，而且不需要调用store.loadData

var data = []; data.push({id: options[0].Id, displayField : options[0].Code + ' | ' + options[0].Description}); 
comboBox.store.add(data);

您所做的一切是不是返回JSON映射到你的店的最佳方式，我已经修改了您的映射代码，这是最好的方法，它不需要您调用加载侦听器并手动添加记录。

Ext.define('ReusableComboBox', { 
extend: 'Ext.form.field.ComboBox', 
alias: 'widget.reusablecombobox', 
queryMode: 'local', 
forceSelection: true, 
valueField: 'id', 
displayField: 'displayField', 
autoLoad: false, 

initComponent: function() { 

    if (!this.store) { 
    var store = Ext.create('Ext.data.Store', { 
     autoLoad: this.autoLoad, 
     fields:[ 'Id', 'Code', 'Description', 'IsIncluded', 'IsActive', 
        { 
         name: 'displayField', 
         convert: function(v, record) { 
          return record.get('Code') + ' | ' + record.get('Description'); 
         } 
        }, 
        {name: 'id', mapping: 'Id'} 
     ], 
     proxy: { 
      type: 'ajax', 
      url: urlContent('validurl/getcodes'), 
      reader: { 
       type: 'json', 
       root: 'data' 
      } 
     } 
    }); 

    Ext.apply(this, { 
     store: store 
    }); 

} 
this.callParent();

}}）;

来源

2013-08-22 22:35:45 objectone

ExtJS ComboBox动态JSON更新

回答

相关问题