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更新

回答

相關問題