ExtJS 4.0.1 Изменение содержимого Viewport
 

Здравствуйте. Есть грабля - нужно изменить содержимое панельки viewport после того, как она отрендерилась и отобразилась. Не хочет зараза. Наваял такой примерчик:

Ext.onReady(function(){
viewport = Ext.create('Ext.Viewport', {
                id: 'layout',
                layout:'border',
                items:[
                    {
                        region:'center',
                        html:'<input type="button" onclick="putGrid()" value="button">',
                        margins:'5 5 5 0'
                    },
                    {
                        id:'gr',
                        region: 'east',
                        html: 'first html',
                        margins:'5 5 5 0'
                    }
                ]
           });
});

function putGrid()
{
    var layout = Ext.getCmp('layout');
    var a = Ext.getCmp('gr');
    a.html = 'new HTML';
    layout.doLayout();
}

При нажатии на кнопочку ничего не происходит. Абсолютно, код отрабатывает, ошибки нет, результата тоже :(
Подскажите плизь люди добрые, как победить хрень сию бесовскую.

Спасибо.

М... Сам только что начал осваивать этот фреймворк.
Но все же.

1. Попробуйте изменить id с 'layout' на что-нибудь позаковыристее, сам на подобное наткнулся, оказывается EXT сам в процессе работы создает кучу своих ID, иногда они могут перекрыться с пользовательскими.
2. Вместо

var layout = Ext.getCmp('layout');
var a = Ext.getCmp('gr');
a.html = 'new HTML';
layout.doLayout();

можно вроде проще:

Ext.get('gr').dom.innerHTML = 'new HTML';
Ext.get('layout').doLayout();

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

Добавляь грид в div, который создал vireport это, на мой взгляд, не совсем правильно. К тому же есть в Ext механизмы layout которые хочется заюзать.

Хм, я просто вместо ваших четырех строк написал свои две, в остальном они делают ТО ЖЕ самое, читабельность кода минимум не ухудшилась, работать будет быстрее на исчезающе малую величину...
И таки мимо фреймворка ничего не идет, просто не используются лишние переменные/присваивания.

Может обменяемся аськами/скайпами/мессенджерами и прочей контактной ерундой для обмена опытом, раз наши пути постижения дао и силы данного фреймворка совпадают ?

Да, строчки по сути те-же, просто для моего реального проекта не подходит ни один из вариантов. Это просто пример был, код в проекте длиннее, мало кто захочет столько читать, поэтому простейший пример и наваял. В реальном проекте у меня гриды в каждом из окошек viewport.
Можно конечно очистить div (который получаем через Ext.get('gr').dom) и забаиндить туда новый грид, но как-то это...по другому хочется. Пока что :)
Если не найду как через api сделать, буду так, куда же деваться :)

Насчет обменяться контактами, с удовольствием, я отправил личкой