Проблема настройки комбо ExtJS

Question

Я столкнулся с интересной проблемой, когда использовал комбо в форме ввода.Моя форма содержит комбо, которые получают данные из магазинов JSON.Он отлично работает при добавлении новой записи, но когда форма открыта для редактирования существующей записи, иногда идентификатор отображается как выбранное, а не его значение (например: 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

Хубидуби

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

Вот альтернатива, которая будет работать прозрачно для всех комбинаций:

Добавьте этот хак где-нибудь перед загрузкой комбо (не обязательно после того, как документ готов)

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 и затем попробуйте установить снова. Вам просто нужно убедиться, что ваш серверный обработчик ищет «запрос» для поиска и ключевое поле для загрузки.

Это также имеет преимущество работы с комбинациями типа «поиск», в которых может быть загружено хранилище, но с неправильными записями