Extjs load combobox из магазина

Question

Я хочу загрузить мой Combobox в панели из магазина.

var colors = new Object(); 

Ext.onReady(function(){ 

colors = Ext.create('Ext.data.Store', { 
    fields: ['id', 'name'], 
    autoLoad: true, 
    proxy: { 
     type: 'ajax', 
     url: 'app/view/main/loadFromDatabase.php', 
     reader: { 
      type: 'json', 
      rootProperty: 'name' 
     } 
    }, 
}); 

Цвета я хочу загрузить немного позже в моей панели как это:

{ xtype: 'combo', 
    fieldLabel: 'Farbe', 
    name: 'farbe', 
    store: colors , 
    queryMode: 'local', 
    displayField: 'name', 
    valueField: 'id' } 

Ответ моего запроса Ajax из loadFromDatabase.php является:

[ { " id ":" 1 ", " name ":" Red " }, { " id ":" 2 ", " name ":" Blue " }, { "идентификатор": "3", "имя": "Зеленый"}]

это кажется допустимым JSON.

Но когда я нажимаю на поле со списком, поле пусто. Что не так?

Answer 1

я нашел другое решение

я не знаю, если это решение лучше, чем другие, но это работает :)

var colorsFromDB = []; 

var colors = Ext.create('Ext.data.Store', { 
    id: "colors", 
    fields: ['id', 'name'], 
    data : colorsFromDB 
}); 

Ext.Ajax.request({ 
    url: "app/view/main/loadFromDatabase.php", 
    method: 'POST', 
    success: function(r) { 
     var res = Ext.decode(r.responseText); 
     if (res !== null) { 
      Ext.each(res.colors, function(obj) { 
       colorsFromDB.push({ 
        id: obj.id, 
        name: obj.name 
       }) 
      }); 
      colors.loadData(colorsFromDB); 
     } 
    }, 
    failure: function(r) { 
     console.log(r.responseText); 
    } 
}); 

Answer 2

Ваш JSON должен выглядеть ниже

'items': [{ 
       'name': 'Lisa', 
       "email": "lisa@simpsons.com", 
       "phone": "555-111-1224" 
      }, { 
       'name': 'Bart', 
       "email": "bart@simpsons.com", 
       "phone": "555-222-1234" 
      }, { 
       'name': 'Homer', 
       "email": "home@simpsons.com", 
       "phone": "555-222-1244" 
      }] 

Затем вы можете указать свой магазин, как

var myStore = Ext.create('Ext.data.Store', { 
    fields:['name','email','phone'], 
    proxy: { 
     type: 'ajax', 
     url: '/yourpath.json', 
     reader: { 
      type: 'json', 
      root: 'items' 
     } 
    }, 
    autoLoad: true 
}); 

Таким образом, вы должны сделать свой JSON в качестве ключа с массивом объектов и указать, что ключ root Недвижимость в reader config.There также нет rootProperty недвижимость для нормального магазина. Исключите это также.

Надеюсь, это вам поможет.

Answer 3

Добавьте их в свой комбо:

listeners : { 
    added : function(tis) { 
      tis.getStore().load(); 
    } 
} 

и добавить их к вашему магазину:

listeners : { 
    load : function() { 
      Ext.getCmp('yourcomboid').setValue(Ext.getCmp('yourcomboid').getValue()); 
    } 
} 

наконец, чтобы избежать второй загрузки, добавьте следующую строку в комбо:

mode : 'local' 

полный код:

{ 
    xtype : 'combo', 
    fieldLabel : 'Role Selection', 
    id : 'role', 
    hiddenName : 'role', 
    hiddenValue : 1, 
    editable : false, 
    emptyText : 'Please select a role', 
    typeAhead : true, 
    triggerAction : 'all', 
    lazyRender : true, 
    mode : 'local', 
    listeners : { 
     added : function(
       tis) { 
      tis.getStore().load(); 
     } 
    }, 
    store : new Ext.data.JsonStore(
      { 
       url : 'getRole', 
       listeners : { 
        load : function() { 
         Ext.getCmp('role').setValue(Ext.getCmp('role').getValue()); 
        } 
       }, 
       fields : ['id','name' ], 
       root : 'resultList', 
      }), 
    displayField : 'name', 
    valueField : 'id' 
}