View Full Version : How to Dynamically change the contents in TabPanel

21 Jun 2011, 10:53 PM

I know that we can write contents in the TabPanel using 'Items', as shown in the example given below. But I want to load the contents at runtime. Actually I want to process in the controller and based on that processing I want to load a 'view' in a specific 'tab panel' in a specific tab.

For example if I have a tab panel with two tabs 'home' and 'more', I want that if a user presses 'more', a view should be rendered in its respective content panel.

how can i do that? any hints?

The static way is this, as shown below

this.dockedItems = new Ext.TabPanel( {
fullscreen: true,
align: 'strech'
dock: 'bottom',
pack: 'center'

items : [ {
title: "More",
iconCls: "more",
text: 'Load1' }]

Thanks in anticipation,

27 Jun 2011, 12:47 AM
hi! I think you can add a method which listens to the cardswitch event of your TabPanel. When that event is fired, the TabPanel Object and the respective ContentPanel Object are passed to your method (I supposed). Then, you can use the update method of the ContentPanel Object to change the display.