Add custom buttons for Message Box in Sencha Touch 2

Sencha Touch allows your application to your provide information to the users using alert(), confirm() and prompt() methods. Each methods differs with their features. But all these message boxes will display one or two buttons using the below configuration values.

Ext.MessageBox.OK: Display OK button.
Ext.MessageBox.CANCEL: Display Cancel button.
Ext.MessageBox.YES: Display Yes button.
Ext.MessageBox.NO: Display No button.
Ext.MessageBox.OKCANCEL: Displays an OK/Cancel button combination.
Ext.MessageBox.YESNO: Displays an Yes/No button combination.
Ext.MessageBox.YESNOCANCEL: Displays an Yes/No/Cancel button combination.

In addition to that, sencha touch also allows to define your own custom buttons inside the Message Box using the buttons configuration propoerty. Let's see an implementation

Ext.Msg.show({
    title: 'Confirm Delete',
    message: 'Are you sure, you want to delete?',
    buttons: [{
        text: 'yes!',
        ui: 'confirm'
    }, {
        text: 'no',
        ui: 'decline'
    }]
});

Above one, will display confirm message box with Yes/No buttons. Please refer the snapshot below.

Hope, you enjoyed this Post.