How to replace a component in ExtJS

Question

I have an ExtJS window with a toolbar at the top and it loads with a simple panel at the bottom using simple HTML. It works great. When I click the button, I want to replace the bottom panel (called content) with another panel. If you tried this

var clickHandler = function(calendar){
    // 'content' is the panel id
    // calendar is also an Ext.Panel object
    Ext.getCmp('content').update(calendar); 
};

What am I missing?

Answer 1

The update replaces the HTML content.

You want to delete the old panel and add a new one. Try .remove () in the old panel and .add () in the new one, and don't forget .doLayout ().