javascript - Adding an Ext.Button class into a Box Component - Stack Overflow

admin管理员组

文章数量:1022794

I'm working with extjs 2.2.1, having a bit of a trouble adding a button into a box ponent class. From my understanding, because box ponent extends the ponent class, it has no config options that allow an item to be added. So the code below does not work...

new Ext.Viewport({
   layout : 'border',
   items : [new Ext.BoxComponent({
      region : 'north',
      el : 'north',
      height : 50,
      items : new Ext.Button({
         iconCls : 'logout',
         text : 'logout',
         tooltip : 'logout',
         handler : function() { }
      }, mainTabPanel])
});

Is there a workaround where I can can add a button into this northern region that is made up of a boxponent class? Any help in the right direction is greatly appreciated. Thank you.

I'm working with extjs 2.2.1, having a bit of a trouble adding a button into a box ponent class. From my understanding, because box ponent extends the ponent class, it has no config options that allow an item to be added. So the code below does not work...

new Ext.Viewport({
   layout : 'border',
   items : [new Ext.BoxComponent({
      region : 'north',
      el : 'north',
      height : 50,
      items : new Ext.Button({
         iconCls : 'logout',
         text : 'logout',
         tooltip : 'logout',
         handler : function() { }
      }, mainTabPanel])
});

Is there a workaround where I can can add a button into this northern region that is made up of a boxponent class? Any help in the right direction is greatly appreciated. Thank you.

• javascript
• button
• extjs
• viewport

Share Improve this question Follow edited Sep 12, 2009 at 2:31 Wouter van Nifterick 24.1k77 gold badges8181 silver badges123123 bronze badges asked Jul 27, 2009 at 23:53 SnowrightSnowright 62544 gold badges1515 silver badges2222 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

BoxComponent doesn't have the ability to contain child items, if you look at the docs you'll see there isn't a configuration option to do that. You will need to use a Container (or some subclass thereof) to get this effect.

There was no way around having child items in a BoxComponent class as it is not a container. so instead, I changed the BoxComponent to a container class, like Panel, that allowed me to add a button class.

new Ext.Viewport({
   layout : 'border',
   items : [new Ext.Panel({
      region : 'north',
      applyTo : 'north',
      height : 50,
      items : new Ext.Button({
         iconCls : 'logout',
         text : 'logout',
         tooltip : 'logout',
         handler : function() { }
     }, mainTabPanel])
  });

I'm working with extjs 2.2.1, having a bit of a trouble adding a button into a box ponent class. From my understanding, because box ponent extends the ponent class, it has no config options that allow an item to be added. So the code below does not work...

new Ext.Viewport({
   layout : 'border',
   items : [new Ext.BoxComponent({
      region : 'north',
      el : 'north',
      height : 50,
      items : new Ext.Button({
         iconCls : 'logout',
         text : 'logout',
         tooltip : 'logout',
         handler : function() { }
      }, mainTabPanel])
});

Is there a workaround where I can can add a button into this northern region that is made up of a boxponent class? Any help in the right direction is greatly appreciated. Thank you.

I'm working with extjs 2.2.1, having a bit of a trouble adding a button into a box ponent class. From my understanding, because box ponent extends the ponent class, it has no config options that allow an item to be added. So the code below does not work...

new Ext.Viewport({
   layout : 'border',
   items : [new Ext.BoxComponent({
      region : 'north',
      el : 'north',
      height : 50,
      items : new Ext.Button({
         iconCls : 'logout',
         text : 'logout',
         tooltip : 'logout',
         handler : function() { }
      }, mainTabPanel])
});

Is there a workaround where I can can add a button into this northern region that is made up of a boxponent class? Any help in the right direction is greatly appreciated. Thank you.

• javascript
• button
• extjs
• viewport

Share Improve this question Follow edited Sep 12, 2009 at 2:31 Wouter van Nifterick 24.1k77 gold badges8181 silver badges123123 bronze badges asked Jul 27, 2009 at 23:53 SnowrightSnowright 62544 gold badges1515 silver badges2222 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

BoxComponent doesn't have the ability to contain child items, if you look at the docs you'll see there isn't a configuration option to do that. You will need to use a Container (or some subclass thereof) to get this effect.

There was no way around having child items in a BoxComponent class as it is not a container. so instead, I changed the BoxComponent to a container class, like Panel, that allowed me to add a button class.

new Ext.Viewport({
   layout : 'border',
   items : [new Ext.Panel({
      region : 'north',
      applyTo : 'north',
      height : 50,
      items : new Ext.Button({
         iconCls : 'logout',
         text : 'logout',
         tooltip : 'logout',
         handler : function() { }
     }, mainTabPanel])
  });

本文标签： javascriptAdding an ExtButton class into a Box ComponentStack Overflow