Добавление группы флажков динамически в formpanel

Question

Я создаю группу флажков с элементами, полученными из магазина, который загружается в функцию Ext.OnReady.Я пытаюсь добавить эту группу флажков в formpanel и получить эту ошибку в вызове add ().'events' - это ноль или не объект.

Вот код, который я пытаюсь использовать ..

Ext.onReady(function () {
{
    store.each(function (record) {
        var itemID = record.get('itemID')
        var itemDesc = record.get('itemDesc');
        jsonDataArray.push([itemID,itemDesc]);
    });

    myCheckboxGroup = new Ext.form.CheckboxGroup({
        id: 'chk1',
        xtype: 'checkboxgroup',
        width: 520,
        border: true,
        items: jsonDataArray
    });

    myForm.add(myCheckboxGroup);
    myForm.doLayout();
}

var myForm = new Ext.form.FormPanel({
     id: 'myForm',
            region: 'center',
            border: true,
            autoHeight: true,
            items: myCheckboxGroup

});

Answer 1

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

var myForm = new Ext.form.FormPanel(
{
    id:     'myForm',
    region: 'center',
    layout: 'form',
    border: true,
    autoHeight: true,
    items: [{
        id: 'chk1',
        xtype: 'checkboxgroup',
        width: 520,
        border: true,
        items: [
            {boxLabel: 'Item 1', name: 'cb-1'},
            {boxLabel: 'Item 2', name: 'cb-2', checked: true}, // checked
            {boxLabel: 'Item 3', name: 'cb-3'},
        ]
    }]
});

Теперь просто замените этот код 'items' на ту же версию JSON. Убедитесь, что вы вернулись со своего вызова Ajax и преобразовали свой ответ в JSON, прежде чем пытаться это сделать.

Дополнительную информацию смотрите в ветке форума по этой теме: Тема форума ExtJs

Answer 2

new Ext.form.FormPanel({
    title: 'Test Form',
    labelWidth: 120,
    width: 350,
    padding: 10,
    tbar: [{
        text: 'Add CheckboxGroup',
        handler: function () {
            formPanel.add({
                xtype: 'checkboxgroup',
                fieldLabel: 'My CheckboxGroup',
                columns: 1,
                items: items
            });
            formPanel.doLayout();
            this.disable();
        }
    }],
    items: comboBox,
    renderTo: 'output'
});

Демо здесь http://ext4all.com/post/extjs-3-add-a-checkboxgroup-dynamically-to-a-form