PDA

View Full Version : Buttons Disappear and Reappear



Kachopsticks
19 Apr 2013, 6:47 AM
I have two tabs, each tab has two forms which each has 2 buttons. When I start my application and focus it on the second tab, everything looks correct. When I then switch to the other tab, my buttons are not displayed, however they should be visible. When I then resize the window the buttons appear. I assume this is some sort of layout issue, however doLayout() does not seem to be working. My button code is below. Any ideas would be appreciated! Thanks.


this.fbar = {
xtype: 'toolbar',buttonAlign: 'left',items: [{xtype: 'button',text: 'Search',width: 50,formBind: true,iconCls: 'icon-magnifier',ref: '../searchButton'
},{xtype: 'button',text: 'Reset',width: 50,iconCls: 'icon-reset',ref: '../resetButton'
}]};

willigogs
20 Apr 2013, 9:30 AM
Try using the following on your tabPanel:


hideMode: 'offsets'


http://docs.sencha.com/extjs/3.4.0/#!/api/Ext.TabPanel-cfg-hideMode

Kachopsticks
13 Dec 2013, 1:22 PM
I ended up fixing this a differnt way but I appreciate the suggestion willigogs. If I get time I might try that out as your suggestion is more cleaner than what I ended up doing. I already had a custom even that was fired when clicking onto the tab that was not display correctly. So to fix my issue I fired a second event to force a doLayout on the tab that was not rendering correctly. That caused my buttons to appear, however I still have a small issue with a spacer not displaying. If I get to your fix I will post the results. Thanks.[CODE]//This code is placed in the container where my buttons would not render. onRender: function(ct, position){ GLOBAL.APP.on('makeSearchTabActive', this.updateLayout, this); }, updateLayout: function(){ this.doLayout(); },[CODE]