CODEWITHSUNDEEP
javascriptextjsextjs4.1extjs3extjs4.2
Isaac
Isaac

Reputation: 2721

How to re-add a removed tab in extjs

I want to add/remove a tab.

I am aware of add/remove methods. But my issue is that I want to re-add the same tab, again. The re-added tab is stored in memory. I want to be able to do something like this:

function addMyTab(tab) {
    var me = this;
    if (!tab) { // use most recently added tab
        tab = me.tab;
    } else { // update most recently added tab
        me.tab = tab;
    }

    var tabPanel = Ext.ComponentQuery.query(..);
    tabPanel.removeAll();
    tabPanel.add(me.tab);
}

This however doesnot work, it throws this error:

Uncaught TypeError: Cannot read property 'addCls' of null

An Extjs forum thread suggest that this is due to trying to add an already destroyed element.

How can re-use the tab?

Upvotes: 1

Views: 3060

Answers (2)

Chris Farmer
Chris Farmer

Reputation: 25396

Since you seem to be saying you're re-adding the same panel that you are removing, I'm guessing that the panel is being destroyed after the removal step. Something like this should work I think:

// initially add the panel
tabPanel.add(myPanel);

// remove it with autoDestroy set to false so Ext doesn't kill your panel
tabPanel.removeAll(false); 

// re-add the panel
tabPanel.add(myPanel);

Upvotes: 3

Polina F.
Polina F.

Reputation: 649

Try something like this :

var currentTab = null;
function addMyTab(tab) {
    var me = this;
    if (tab) { // use most recently added tab
        currentTab = tab;
    } 
    var tabPanel = Ext.ComponentQuery.query(..);
    tabPanel.removeAll();
    tabPanel.add(currentTab );
}

currentTab is a global variable . If you pass a new tab to update the current tab , replace the current tab with the new tab it , otherwise use the current tab as it is. Make sure that before using currentTab the first time , to initialize it with some tab.

Upvotes: 0

Related Questions