Extjs Привязка статических данных TreePanel к FormPanel

Question

Это может быть очевидно, но я не могу понять, как связать статический объект json с FormPanel в extjs.Я новичок в ExtJs, поэтому я все еще учусь.У меня есть TreePanel с различными дополнительными атрибутами, содержащимися в объекте node.attributes.Когда узел щелкает по идентификатору, как для отображения данных в форме.Ниже то, что у меня есть.Данные не привязываются к полям.

Все примеры для extjs охватывают загрузку данных из магазина или URL-адреса.

tree.on('click', function (n) {

            var detailEl = details.body;

            if (n.attributes.iconCls == 'page') {

                detailEl.hide();
                var form = new Ext.FormPanel({
                    frame: true,
                    renderTo: detailEl,
                    title: 'Page Details',
                    bodyStyle: 'padding:5px 5px 0',
                    width: 350,
                    defaults: { width: 230 },
                    defaultType: 'textfield',
                    data: n.attributes,
                    items: [{
                        fieldLabel: 'Title',
                        name: 'title',
                        allowBlank: false
                    }, {
                        fieldLabel: 'Url',
                        name: 'url',
                        allowBlank: false
                    }, {
                        fieldLabel: 'Live',
                        name: 'islive',
                        xtype: 'checkbox'
                    }
                ],
                    buttons: [{
                        text: 'Save'
                    }]
                });


                detailEl.slideIn('l', { stopFx: true, duration: .2 });
            }

        });

Также рекомендуется каждый раз создавать новую FormPanel или перепривязывать существующую formPanel?

Спасибо,

Ian

Answer 1

Рекомендуется, чтобы форма визуализировалась один раз и изменить значения в соответствии с выбранными узлами.

Как уже упоминалось, data не поле для использования. Для массового присвоения значений следует использовать метод Ext.form.BasicForm.setValues( Array/Object values ). Вы получаете BasicForm объект, используя метод FormPanel getForm().

Подведение итогов

var form = new Ext.FormPanel({/*...*/});
tree.on('click', function (node){
    form.getForm().setValues(node.attributes);
});

Обратите внимание, что имена полей и имена атрибутов должны соответствовать.

Answer 2

Я не верю, что ключ конфигурации data делает то, что вы думаете.

Попробуйте установить значения индивидуально в определениях полей.