Zlelik
Zlelik

Reputation: 570

ExtJS Ex.Msg adding additional listener

I have an external javascript library, which I have to use. The library is using ExtJS 6.6. This library has this code

var confirmationCallback = function(btn) {
  if (btn == "yes") {
    //do something
  }
};

Ext.Msg.show({
  title:  'Confirm Operation',
  buttons: Ext.MessageBox.YESNO,
  fn: confirmationCallback,
  icon: Ext.MessageBox.WARNING,
  msg: 'Are you sure?',
  scope: this
});

My problem is that I need to do something when the user clicks No button and there is no handler for this in the library. They only handle Yes button. Also, I cannot modify this library because of license and many other reasons.

My question: Can I add No button handle somehow? I can only put my javascript code just before Ext.Msg.show call (there is a customisation point in the library at this place). I tried something like Ext.Msg.on("hide", console.log("hide listener")); and some other ways and it does not work. Ideally, it will be good to add my part at the end of their callback code. Or add my code to the hide/close event of the message box.

Upvotes: 0

Views: 264

Answers (1)

If you execute:

Ext.Msg.show({
    title: 'Confirm Operation',
    buttons: Ext.MessageBox.YESNO,

    icon: Ext.MessageBox.WARNING,
    msg: 'Are you sure?',
    fn: function (buttonId) {
        alert('You pressed the "' + buttonId + '" button.');
    },
    scope: this
});

You can see that you received in buttonId 'yes', 'no' or 'cancel'.

Then, in your code:

var confirmationCallback = function(btn) {
  if (btn == "yes") {
    //do something
  } else if (btn == "no") {
    //do something
  } else if (btn == "cancel") {
    //The user has closed the dialog.
  }
};

Update

You can override Ext.window.MessageBox with the ExtJs Ext.override function. It's a valid option and you do not violate the terms of the license.

I have written that Sencha Fiddle showing the solution: https://fiddle.sencha.com/#view/editor&fiddle/3ch0

Upvotes: 1

Related Questions