Yes/No buttons in Confirm box in Sencha touch

Question

I have put a confirm box on the logout option of my application. Code for the same is as follows:

var abc = Ext.Msg.confirm('Confirm logout', 'Are you sure you want to logout?', function(e)
 {
   if(e == 'yes')
     {
        // logout code
     }
 }
 );

No button of the confirm box is visible before the yes button.

How can I display Yes button before the No Button?

Any help is appreciated.

score 4 · Accepted Answer · answered Dec 01 '11 at 23:17

According to the sencha touch source code ( http://docs.sencha.com/touch/1-1/source/MessageBox.html#Ext-MessageBox-method-confirm ) YESNO is defined as "no, yes":

(function(){
    var B = Ext.MessageBox;

    Ext.apply(B, {
        OK     : {text : 'OK',     itemId : 'ok',  ui : 'action' },
        CANCEL : {text : 'Cancel', itemId : 'cancel'},
        YES    : {text : 'Yes',    itemId : 'yes', ui : 'action' },
        NO     : {text : 'No',     itemId : 'no'},
        // Add additional(localized) button configs here

        // ICON CSS Constants
        INFO     : 'x-msgbox-info',
        WARNING  : 'x-msgbox-warning',
        QUESTION : 'x-msgbox-question',
        ERROR    : 'x-msgbox-error'
    });

    Ext.apply(B, {
        OKCANCEL    : [B.CANCEL, B.OK],
        YESNOCANCEL : [B.CANCEL, B.NO, B.YES],
        YESNO       : [B.NO, B.YES]
        // Add additional button collections here
    });

})();

You can use Ext.override to override this functionality in your own app:

Ext.override(Ext.MessageBox, {
    YESNO: [Ext.MessageBox.YES, Ext.MessageBox.NO]
});

Hi Ken, do you know how to override with special characters, for example cyrillic? — inane, Jul 22 '15 at 14:40
I'm afraid I can't help you with that! I haven't worked with Sencha Touch since 2011! I have upvoted your post at http://stackoverflow.com/questions/31564533/cyrillic-characters-in-messagebox-class-of-sencha-touch — ByteWelder, Jul 22 '15 at 14:47

score 3 · Answer 2 · answered Aug 01 '13 at 11:27

You can override like the below code in ST2.1, Can also implement localization in YES/NO buttons using this.

Ext.MessageBox.override({
        confirm: function(title, message, fn, scope) {
        return this.show({
            title       : title || null,
            message     : message || null,
            buttons     : [
            {text: 'Yes', itemId: 'yes', ui: 'action'},
            {text: 'No',  itemId: 'no'}
        ],
            promptConfig: false,
            scope       : scope,
            fn: function() {
                if (fn) {
                    fn.apply(scope, arguments);
                }
            }
        });
    }

        });

This is the only working solution for Sencha Touch 2.3 in this thread!! — Marco Marsala, Apr 15 '14 at 10:48

score 2 · Answer 3 · edited Apr 03 '13 at 10:35

2

It is Very easy Try this

Ext.Msg.confirm("Logout", "Are you Sure u want to LogOut?", function(btn){
  if (btn == 'yes'){
    Ext.Viewport.setActiveItem({xtype:"Home"});   // which page wants to redirect
  }
});

edited Apr 03 '13 at 10:35

mr.VVoo

2,265
20
30

answered Apr 03 '13 at 10:27

Gayathri Mohan

2,924
4
19
25

score 1 · Answer 4 · answered May 10 '13 at 17:12

1

I tried this, and works for me:

Try this solution:

<script type="text/javascript">
     (function () {
        Ext.override(Ext.MessageBox, {
            buttonText: { yes: "Sí", no: "No", cancel: "Cancelar" }
        });
      })();
</script>

answered May 10 '13 at 17:12

Alan Maldonado

11
1

user3304358 · Answer 5 · 2014-12-07T03:30:50.593

 Ext.Msg.show({
                    title: '提示',
                    message: '是否继续?',
                    width: 300,
                    buttons: [
                        {text: '是', itemId: 'yes', ui: 'action'},
                        {text: '否', itemId: 'no'}
                    ],
                    fn: function (buttonId) {
                        alert('You pressed the "' + buttonId + '" button.');
                    }
                });

Yes/No buttons in Confirm box in Sencha touch

5 Answers5