Question

我在输入形式中使用组合时遇到了一个有趣的问题。我的表单包含从json存储中获取数据的组合。它在添加新记录时工作正常，但是当打开表单以编辑现有记录时，有时id显示为选中而不是其值（例如：有5而不是“apple”）。我认为它会在完成加载组合之前设置值。

有没有办法解决这个问题？我把代码放在这里创建组合：

function dictComboMaker( store, fieldLabel, hiddenName, name, allowBlank, myToolTipp ) {
      comboo = {
      xtype : 'combo',
      id: 'id-'+name,
      allowBlank: allowBlank,
      fieldLabel : fieldLabel,
      forceSelection : true,
      displayField : 'value',
      valueField : 'id',
      editable: false,
      name: name,
      hiddenName : hiddenName,
      minChars : 2,
      mode: 'remote',
      triggerAction : 'all',
      store : store
     };


    function dictJsonMaker(url) {
      store = new Ext.data.JsonStore({ 
      root : 'results', // 1
      fields : [ 'id','value' ],
      url : url,
      autoLoad: true});

      return store;
     }


    var comboKarStore = dictJsonMaker('/service/karok');
    var comboKar= dictComboMaker(comboKarStore, 'Kar', 'karid', 'kar', false, '');

    // then comboKar is added to the form

Hubidubi

Answer 1

bmoaskau你的解决方案很好我更喜欢通过我的组合插件来做到这一点。尝试一下，对我来说就像一个魅力，只需添加

就可以将它绑定到一个组合

plugins: new Application.plugins.comboloadvalue(),

到你的组合配置对象

Ext.ns('Application.plugins');

Application.plugins.comboloadvalue = Ext.extend(Ext.util.Observable, {
field : null,

init : function(field){
    var self = this;
    this.field = field;
    this.store = field.getStore();
    this.setLoaded(false);

    this.store.on('load', function(){
        return self.onLoad();
    }, this);
},

onLoad : function(){
    if(this.store !== null){
        this.field.setValue(this.field.getValue());
        this.setLoaded(true);
    }
    return true;
},

setLoaded: function(bool){
    this.store.hasOnceLoaded = bool;
},

getLoaded: function(){
    return this.store.hasOnceLoaded;
}

});

Answer 2

加载远程数据的存储是异步执行的，因此您应始终在适当的回调中处理存储数据，以确保它已准备就绪。例如：

var comboKar, comboKarStore = dictJsonMaker('/service/karok');

comboKarStore.on('load', function(){
    comboKar = dictComboMaker(comboKarStore, 'Kar', 'karid', 'kar', false, '');
});

Answer 3

以下是一种可以透明地用于所有组合的替代方案：

在加载任何组合之前在某处添加此hack（不必在文档准备好之后）

Ext.form.ComboBox.prototype.nativeSetValue = Ext.form.ComboBox.prototype.setValue;
Ext.form.ComboBox.prototype.setValue=function(v){
   var combo = this;
   if(this.valueField){
      var r = this.findRecord(this.valueField, v);
      if (!r) {
         var data = {}
         data[this.valueField] = v
         this.store.load({
            params:data,
            callback:function(){
               combo.nativeSetValue(v)
            }
         })   

      } else return combo.nativeSetValue(v);
   } else combo.nativeSetValue(v);
}

这基本上会检查您的值是否在您的商店中，如果不是，请使用valueField = value进行回调，然后再次尝试设置。您只需要确保您的服务器端处理程序查找搜索的“查询”和负载的关键字段。

这也有使用“搜索”类型组合的优势，这些组合可能已加载存储，但记录错误

ExtJS组合设置问题

3 个答案: