Заполнение комбо из XmlStore с помощью Ext js designer

Question

Я пытаюсь заставить работать простой (noob) пример Combo, загруженного данными из файла XML.Вот мой xml:

<?xml version="1.0" encoding="UTF-8"?>
  <accounts>
 <account> 
  <name>Savings Account</name>
  <id>1</id>
 </account>
<account> 
  <name>Current Account</name>
  <id>2</id>
 </account>
</accounts>

Когда я настраиваю и добавляю XmlStore, он сообщает о найденных 2 записях.

Вот код для XmlStore:

cteo = Ext.extend(Ext.data.XmlStore, {
constructor: function(cfg) {
    cfg = cfg || {};
    cteo.superclass.constructor.call(this, Ext.apply({
        storeId: 'cteo',
        url: 'cteo.xml',
        record: 'account',
        data: '',
        fields: [
            {
                name: 'name',
                mapping: 'name'
            },
            {
                name: 'id',
                mapping: 'name'
            }
        ]
    }, cfg));
    }
 });
new cteo();

наконец, это код для комбо:

MyPanelUi = Ext.extend(Ext.Panel, {
title: 'My Panel',
width: 400,
height: 250,
initComponent: function() {
    this.items = [
        {
            xtype: 'label',
            text: 'Cuenta Origen'
        },
        {
            xtype: 'combo',
            store: 'cteo',
            displayField: 'name',
            valueField: 'id'
        }
    ];
    MyPanelUi.superclass.initComponent.call(this);
    }
});

Это должно быть что-то простое, но я застрял ...

Answer 1

Это ничего не изменит:

store: 'cteo',

Вам необходимо передать указанную ранее ссылку на объект, а не строку:

store: cteo,

В качестве альтернативы, вы можете вызвать Ext.StoreMgr.lookup('cteo'), но, судя по вашему коду, я предполагаю, что ссылка на переменную была вашим намерением.

Один комментарий к вашему коду.Выполнение этого:

cteo = Ext.extend(Ext.data.XmlStore, {
...
cteo();

... немного странно и, скорее всего, создает глобальную переменную в области видимости окна (при условии, что cteo не определен как var где-то ранее).Думайте об этом как об определении пользовательского класса, а затем о создании нового экземпляра класса, который вы определили.Кроме того, подумайте о своем наименовании - подкласс магазина должен быть определенным типом магазина, который должен быть очевиден в названии.Как правило, ваш код должен выглядеть примерно так:

Ext.ns('MyNamespace');

MyNamespace.CteoStore = Ext.extend(Ext.data.XmlStore, {
...
});
var cteoStore = new CteoStore();

Ах да, еще одна вещь.Вам не нужно переопределять конструктор с единственной целью предоставления конфигураций по умолчанию.Просто сделайте это:

MyNamespace.CteoStore = Ext.extend(Ext.data.XmlStore, {
    storeId: 'cteo',
    url: 'cteo.xml',
    record: 'account',
    data: '',
    fields: [
        {
            name: 'name',
            mapping: 'name'
        },
        {
            name: 'id',
            mapping: 'name'
        }
    ]
});

Это также более полезно, поскольку эти конфиги можно переопределить, в отличие от вашего примера.Это делает его более пригодным для повторного использования (например, если вы когда-нибудь хотели назначить другой идентификатор другому экземпляру).

Answer 2

Проверьте эту тему на сайте sencha:

http://www.sencha.com/forum/showthread.php?105818-(noob)-Populating-combo-from-XmlStore-with-Ext-js-designer