Add button in title bar on a specific card only, in sencha touch

Question

I need to show a refresh button on a specific card only, the title bar to which is defined in some parent Panel. I have tried in the following way:

Parent Panel:

config:
{
    layout : 'fit',
    items:[
        {
            xtype:'titlebar',
            docked:'top',
            title:'Directory',
            items:[
                {
                    xtype: 'button',           //First Button-visible in all cards
                    docked: 'left',
                    iconCls: 'arrow_left',
                    action: 'back'
                },
                {
                    xtype: 'button',           //Target button-to be visible in one card only
                    docked: 'right',
                    iconCls: 'refresh',
                    action: 'reset',
                    hidden: true              //hiding this button
                }
            ]
        },
        {
            xtype:'tabpanel',
            tabBarPosition:'top',
            items:[
                {
                    title: 'Tab1',                              
                    xtype: 'Card1'
                },
                {
                    title: 'Tab2',                              
                    xtype: 'Card2'
                }
            ]
        }
    ]
}

I have a hidden property set to true for refresh button in above panel, which i want to set false for a card.

The target card is set active on a button click. I am changing hidden property to false in the buttonTapListener, and then setting the target card as active. But the refresh button do not get visible. Here is the controller code:

onButtonTap: function()
{
    ...
    var getParentPanelRef = this.getParentPanel();
    var parentPanelItems = getParentPanelRef.getItems();
    console.log(parentPanelItems.items[0].config.items[1].hidden);      //Prints true
    directoryMainContainerItems.items[0].config.items[1].hidden=false;
    console.log(parentPanelItems.items[0].config.items[1].hidden);      //Prints false

    var directorySearchMainUIRef = this.getSomeOtherParentPanel();
    directorySearchMainUIRef.setActiveItem(1);                          //Switches to target card
}

The value of hidden gets changed, but button doesn't come up. Please suggest an alternative if so. Thanks in advance.

Answer 1

Instead of hiding/showing the button you could add/destroy the button. I had a similar problem a while a ago and it seems that sencha not always detects when it should redraw components.