CODEWITHSUNDEEP
extjssencha-touch
user478679
user478679

Reputation: 31

How do I update a tabPanel item title in extjs (sencha touch)

How od I update the title property for an item in a tabPanel from another function?

mainpanel is my tabPanel and I am successfully updating the title according to my js debugger. Calling doLayout(); doesn't seem to redraw the tab in the UI though!

var mainpanel = Ext.getCmp('mainpanel');

   var item = mainpanel.items.items[0];

   item.title = 'Me';
   mainpanel.doLayout();

Upvotes: 3

Views: 6774

Answers (5)

Trish
Trish

Reputation: 29

let tabTitle = Ext.ComponentQuery.query('#tabs');// tabs is the itemId for tab panel created tabTitle.getAt(index_no_for_tab).tab.setTitle('My new title');

Upvotes: 0

digz6666
digz6666

Reputation: 1828

In extjs 4.0, 4.1 or 4.1.1 you can change title if you have the tab element variable:

//var tabEl = this.getActiveTab();
Ext.getDom(tabEl).tab.btnEl.dom.innerText = 'My New Title';

You also can define new method in the tab panel as following:

setTabTitle: function(tabEl, title) {
    Ext.getDom(tabEl).tab.btnEl.dom.innerText = title;    
}

Upvotes: 1

Nag
Nag

Reputation: 1504

You can use this for updating the title from another function

Panel.title1Button.setText(finToolbarTitle);

or

If you mentioned toolbar in docked items 

Panel.dockedItems.items[1].setTitle(toolbarTitle);

Upvotes: 1

Joseph Lust
Joseph Lust

Reputation: 20015

Here is an override function I wrote to set the title of a tab. Include this in your js before the file that uses it. It adds the TabPanel.setTabTitle( tabNo, newTitle ) method.

Example use in a callback within a tab:

this.ownerCt.setTabTitle( 0, 'My Title');

Override code:

/**
 * Overrides the Ext.TabPanel to add .setTabTitle() function
 */
Ext.override(Ext.TabPanel, {
    /**
     * Set the title of a specific tab
     */
    setTabTitle: function( tabNo, newTitle ) {
        // make sure we have a number and tab exists
        if( tabNo>=0 && !Ext.isEmpty( this.getTabEl(tabNo))) {
            var tabEl = this.getTabEl(tabNo); // walk down dom, update title span
            Ext.getDom(tabEl).down('.x-tab-strip-text').innerHTML = newTitle;
        }
     }
 });

Upvotes: 1

Drasill
Drasill

Reputation: 4016

Isn't there a setTitle() method ?

Upvotes: 1

Related Questions