CODEWITHSUNDEEP
javascriptcsspopupsencha-touch-2messagebox
Haradzieniec
Haradzieniec

Reputation: 9338

Sencha Touch 2: Message box with buttons: How to align buttons vertically?

Here is the code that works fine.

Ext.Msg.show({
    title: 'The title',
    message: 'and some text...',
    scope: this,
    buttons : [
       {
         itemId : 'no',
         text   : 'Top button'
       },
       {
           itemId : 'yes',
           text   : 'Bottom button'
         }
       ],
    fn: function(btn) {
      if (btn == 'yes'){
       //do something
      }
     }
});

How to align the buttons vertically? By default they go in one line horizontally.

Upvotes: 1

Views: 2609

Answers (1)

GenieWanted
GenieWanted

Reputation: 4513

If you only have two buttons in your Ext.Msg.Show, you can achieve the desired results with 'docked' property. (Like this):

Good Luck!

Here is the updated code:

Ext.Msg.show({

    title: 'The title',
    message: 'and some text...',

    scope: this,
    buttons : [

       {

         docked: 'top',
         itemId : 'no',
           id: 'no',
         text   : 'Top button'
       },
       {

           docked: 'bottom',
           itemId : 'yes',
           id : 'yes',
           text   : 'Bottom button'
         }
       ],
    fn: function(btn) {
      if (btn == 'yes'){
       //do something
      }
     }
});

Upvotes: 2

Related Questions