Ext JS пустой ItemSelector при первой загрузке из ответа JSON

Я создаю форму с Itemselector, используя extjs 4. Я использую Json для хранилища, где у меня есть ответ JSON следующим образом:

{"items":[{"id":"12","name":"Cable"},{"id":"8","name":"Document"},{"id":"1","name":"Equipment"},{"id":"2","name":"Instrument"},     {"id":"10","name":"Isometric"},{"id":"11","name":"Joint"},{"id":"4","name":"Line"},{"id":"3","name":"LineSeg"},{"id":"5","name":"Specialty"},{"id":"6","name":"Spool"},{"id":"7","name":"Valve"},{"id":"9","name":"Weld"}]}

Моя форма

Ext.require([
        'Ext.ux.form.MultiSelect',
        'Ext.ux.form.ItemSelector'
        ]);


Ext.define('MyAPP.view.directory.MyForm', {
    extend: 'Ext.form.Panel',
alias:'widget.myform',
    border: false,
    split: true,
bodyPadding: 5,
lableWidth:30,
autoScroll : true,
defaults: {
    anchor: '100%'

},
defaultType: 'textfield',
items: [
    {
xtype:'fieldset',
title: 'Commodities',
collapsible: true,
border:0,
defaultType: 'textfield',
defaults: {anchor: '100%'},
layout: 'anchor',
items :[
      {
        xtype: 'itemselector',
        name: 'commoselector',
        id:'commoselector',
        listAvailable:'',
        listSelected:'',
        fieldLabel: '',
        imagePath: 'extjs407/ux/css/images/',
        store: Ext.create('MyAPP.store.CommodityStore'),
        displayField: 'name',
        valueField: 'id',
        //value: ['9'],
        //allowBlank: false,
        msgTarget: 'under'
      }
 ]
},



 initComponent: function () {
    this.callParent(arguments);
}
});

Мой магазин

 Ext.define('MyAPP.store.CommodityStore', {

  extend: 'Ext.data.Store',

 constructor: function(cfg) {

 var me = this;
 cfg = cfg || {};
 me.callParent([Ext.apply({
     autoLoad: true,
     autoDestroy: true,
     storeId: 'CommodityStore',
     proxy: {
        type: 'ajax',
        url: 'getCommodityList',
        reader: {
            type: 'json',
            root: 'items'
        }
    },
    fields: [
            {name: 'id'},
            {name: 'name'}
    ]
   }, cfg)]);
  }
   });

Когда форма создана, она не загружает пустое хранилище, хотя JSON правильный. Где я делаю неправильно? Пожалуйста помоги. заранее спасибо


extjs ext4 jsonstore extjs4 itemselector
person aswininayak    schedule 21.05.2012    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Вам не нужно создавать магазин вручную, как в store: Ext.create('MyAPP.store.CommodityStore'),

Обычно вы просто ставите store: 'CommodityStore', а все остальное ExtJs сделает автоматически.

person sha    schedule 21.05.2012
comment
Ша, спасибо за ваш ответ .. но что я отладил, так как ответ от сервера занимает время, поэтому это хранилище пусто .. Когда я жестко кодирую json, он правильно заполняет данные .. Итак, что может быть решением? - person aswininayak; 21.05.2012
comment
Вы должны добавить обработчик событий для события load магазина и назначить все данные туда. - person sha; 21.05.2012
comment
Я исправил это, используя прослушиватель перед рендерингом и привязав хранилище. Подробнее см.: stackoverflow.com/questions/9661503/ - person aswininayak; 22.05.2012
comment
Это тоже сработает. Но там ключ - дождаться пока магазин загрузится - person sha; 22.05.2012

arrow_upward
0
arrow_downward 

initComponent: function () {
var me = this;
Ext.applyIf(me, {
    listeners: {
    beforerender: {
            fn: me.onFormBeforeRender,
            scope: me
        }
   }
});

me.callParent(arguments);

},

onFormBeforeRender: function(abstractcomponent, options) {
        // where store is created globally like this var store =          Ext.create('TIP.store.CommodityStore');

store.load(function(){
    Ext.getCmp("commoselector").bindStore(store);
});
}

И в магазине autoLoad:false

person aswininayak    schedule 22.05.2012