Sencha Touch 2.4.2 Button Function not working

Question

I have a toolbar with 4 buttons. 'Approval', 'New Request Patient', 'View Request Details', and 'Close' buttons. By default when the page loads, all of these buttons are visible EXCEPT for the 'Approval' button. I want the 'Approval' button to be visible when the user clicked on the 'New Request Patient' which will take the user to that page. And the button will be hidden again when the user clicked on the 'View Request Details' button. So that is my first problem.

My second problem is when the user clicked on the 'New Request Patient' button, the 'View Request Details' button will change its text to 'View Request List'. For some reason I can't figure this out. Here is my code: -

{
                xtype: 'toolbar',
                docked: 'bottom',
                layout: {
                    pack: 'left',
                    size: '20px'
                },
                defaults: {
                    margin: '10 10'
                },
                items: [
                    {
                        xtype: 'button',
                        text: 'Approval',
                        hidden: true
                    },
                    {
                        xtype: 'button',
                        text: 'New Request Patient',
                        handler: function () {
                            Ext.getCmp('requestpatient').setActiveItem(1);
                        },

                        //listeners: {
                        //    tap: function()
                        //    {
                        //        myButton.setText('View Request List');
                        //    }
                        //}
                    },
                    {
                        xtype: 'button',
                        id: 'myButton',
                        text: 'View Request Details',
                        handler: function () {
                            Ext.getCmp('requestpatient').setActiveItem(0);
                        }

                    },
                    {
                        xtype: 'button',
                        text: 'Close'
                    },
                ]
            },

Guilherme Lopes Guilherme Lopes · Accepted Answer · 2016-05-11T07:31:51

You can do something like this (see below), but Im not sure I understand what you mean by your button text gets changed? I see a commented code there, to do exactly that.

items: [{
    xtype: 'button',
    text: 'Approval',
    hidden: true
},{
    xtype: 'button',
    text: 'New Request Patient',
    handler: function (b) {
         Ext.getCmp('requestpatient').setActiveItem(1);
         b.up().down('button[text=Approval]').setHidden(false);
    },

},{
    xtype: 'button',
    itemId: 'myButton',
    text: 'View Request Details',
    handler: function (b) {
        Ext.getCmp('requestpatient').setActiveItem(0);
        b.up().down('button[text=Approval]').setHidden(true);
    }

},{
    xtype: 'button',
    text: 'Close'
}]

Sencha Touch 2.4.2 Button Function not working

1 Answers