Cuadro de mensaje ExtJs con botones personalizados

extjs3

Question

Cómo mostrar el cuadro de mensaje ExtJS con botones personalizados.

Quiero un cuadro de mensaje con un mensaje personalizado y los botones "Cancelar" y "Desactivar". Por favor, da una idea.

buttons: [{
    text: "Cancel",
    handler: function () {
        Ext.MessageBox.hide();
        //submitTicketForm();
    }
},{
    text: "Deactivate",
    handler: function () {
        Ext.MessageBox.hide();
    }
}],

Lo estoy usando así pero no tengo botones.

Answer 1

MessageBox es una instancia única de una ventana administrada internamente utilizada para solicitud, demostración, alerta, etc.

Puedes cambiar el botónTexto pasando una cadena para mostrar de esta manera:

buttons: {ok: "Foo", cancel: "Bar"}

Consulte: MessageBox

buttons: { 
                ok: "Foo", 
                handler: function(){ 
                    Ext.MessageBox.hide(); 

                },
                cancel: "Bar",
                handler: function(){
                    Ext.MessageBox.hide();
                }
        }

Answer 2

En ExtJS 4, puede hacer su propio componente así:

Ext.define(''App.view.MyDialog'', {
    /**
     * Shows the dialog.
     */
    show: function() {
        var dialog = Ext.create(''Ext.window.MessageBox'', {
            buttons: [{
                text: ''baz'',
                iconCls: ''icon-add'',
                handler: function() {
                    dialog.close();
                }
            }]
        });

        dialog.show({
            title: ''foo!'',
            msg: ''<p>bar?</p>'',
            icon: Ext.MessageBox.WARNING
        });

        dialog.setHeight(160);
        dialog.setWidth(420);
    }
});

entonces:

var dialog = Ext.create(''App.view.MyDialog'');
dialog.show();

Answer 3

Use ''buttonText'' en lugar de ''button'',

buttonText: {ok: ''Deactivate'', cancel: ''Cancel''},
fn: function(btn) {
    if (btn === ''ok'') {
        Ext.MessageBox.hide();
    }  else {
        Ext.MessageBox.hide(); 
    } 
}

Answer 4

En ExtJS 4 y ExtJS 5, para configurar texto personalizado para botones, necesita usar ambos buttons y buttonText configuraciones de buttonText :

buttons: [{
    Ext.Msg.OK
}],
buttonText: { 
    ok: "Custom text"
},
fn: function() { 
    // ...handle OK button
}