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
}