How to add menus to a button manually

[liuzhisheng]

The example in document like this:

var btn1=new Ext.Button({
text:"File",
menu:[
{text:"Open"},
{text:"Save"},
{text:"Close"}]});

But I want to add menus to button manually, like:

var btn1=new Ext.Button({text:"File"});
btn1.addMenu(...);

of course,addMenu method is not exist, how do I can implement this?

Thanks.

[evant]

Untested, but give this a go:

Ext.override(Ext.Button,
{
   initComponent: function()
   {
      Ext.Button.superclass.initComponent.call(this);
      this.addEvents(
            "click",
            "toggle",
            'mouseover',
            'mouseout',
            'menushow',
            'menuhide',
            'menutriggerover',
            'menutriggerout'
      );
      if (this.menu)
      {
         var m = this.menu;
         delete this.menu;
         this.setMenu(m);
      }
         
      if (typeof this.toggleGroup === 'string')
         this.enableToggle = true;
   },
   
   setMenu: function(menu)
   {
      var hasMenu = (this.menu != null);
      this.menu = Ext.menu.MenuMgr.get(menu);
      if (this.rendered && !hasMenu)
      {
         this.el.child(this.menuClassTarget).addClass('x-btn-with-menu');
         this.menu.on("show", this.onMenuShow, this);
         this.menu.on("hide", this.onMenuHide, this);
      }
   },
   
   clearMenu: function(destroy)
   {
      if (this.rendered)
      {
         this.el.child(this.menuClassTarget).removeClass('x-btn-with-menu');
         this.menu.un('show', this.onMenuShow, this);
         this.menu.un('hide', this.onMenuHide, this);
      }
      if (destroy)
         Ext.destroy(this.menu);
         
      this.menu = null;
   }
}
);

[himanshu24]

Did the Same but getting below error:

TypeError: this.el.child(...) is null
[Break On This Error]     

this.el.child(this.menuClassTarget).addClass('x-btn-with-menu'); 

var manageColumnsButton = Ext.override(Ext.Button,
    {icon : 'images/manage_columns.png',
    id:'manageColumnsButton',
    
       initComponent: function()
       {
          Ext.Button.superclass.initComponent.call(this);
          this.addEvents(
                "click",
                "toggle",
                'mouseover',
                'mouseout',
                'menushow',
                'menuhide',
                'menutriggerover',
                'menutriggerout'
          );
          if (this.menu)
          {
             var m = this.menu;
             delete this.menu;
             this.setMenu(m);
          }
             
          if (typeof this.toggleGroup === 'string')
             this.enableToggle = true;
       },
       
       setMenu: function(menu)
       {
          var hasMenu = (this.menu != null);
          this.menu = Ext.menu.MenuMgr.get(menu);
          if (this.rendered && !hasMenu)
          {
             this.el.child(this.menuClassTarget).addClass('x-btn-with-menu');
             this.menu.on("show", this.onMenuShow, this);
             this.menu.on("hide", this.onMenuHide, this);
          }
       },
       
       clearMenu: function(destroy)
       {
          if (this.rendered)
          {
             this.el.child(this.menuClassTarget).removeClass('x-btn-with-menu');
             this.menu.un('show', this.onMenuShow, this);
             this.menu.un('hide', this.onMenuHide, this);
          }
          if (destroy)
             Ext.destroy(this.menu);
             
          this.menu = null;
       }
    }
    );