Это своего рода неправильный подход, во-первых, так, как вы его написали, панель форм визуализируется с 3 картами, которые вы определили в начале, в обработчике опций, приписывание новых объектов переменной карты не имеет никакого отношения к сделать с панелью формы, чтобы изменить или добавить новые элементы, используйте метод add панели, а затем макет setActive.
function (btn){
btn.up('panel').add([{
id: 'card-1',
html: 'Page AAAAAAAAAAAA',
border: false
}, {
id: 'card-2',
html: 'Page BBBBBBBBBBBB',
border: false
}]);
btn.up('panel').getLayout().setActiveItem(aPage);
}
Я имею в виду, что это макет карты, есть несколько компонентов на панели и их переключение, и они показывают только один.
Что касается сетки с подходом на одну ячейку, это зависит от того, чего вы хотите достичь, если ваши страницы похожи и отличаются только данными, которые вы можете использовать. Просто создайте шаблон Ext.XTemplate, содержащий HTML, который вы хотите визуализировать, и используйте функцию рендерера для столбца сетки.
....
xtype: 'gridpanel',
tpl: new Ext.XTemplate('<html goes here/>').compile(),
columns: [
{
dataIndex: 'id',
header: 'theColumn',
renderer: function(value,meta,record){
return this.tpl.applyTemplate(record.data);
}
},
....