CODEWITHSUNDEEP
javascripthtmlextjsoverriding
Jacob
Jacob

Reputation: 4021

Ext js override init component function

I am trying to override some code in the initComponent function of the Ext.window.MessageBox class. But none of the things that I change get applied.

What is the problem here? Am I missing something?

Ext.define('hds.override.MessageBox', {
    override: 'Ext.window.MessageBox',

   initComponent: function() {

    console.log("init component 1"); //not reached

    this.callParent();


    console.log("init component 2"); //not reached
  }


});

Edit:

I have also tried replacing override with extend and the inside intiComponent is still not reached. Do I need to change the location of the file when changing to extend??

Upvotes: 1

Views: 1532

Answers (1)

Amit Aviv
Amit Aviv

Reputation: 1816

If what you want is to change the behavior of Ext.Msg which is an instance of the class Ext.window.MessageBox you need to make it an instance of your overridden class:

Ext.define('MyMessageBox', {
    override: 'Ext.window.MessageBox',
    initComponent: function() {
        this.callParent();
        //your changes here..
    }
},function() {
    Ext.MessageBox = Ext.Msg = new this();
});

Check out this fiddle where I changed the default padding inside initComponent

Upvotes: 5

Related Questions