PDA

View Full Version : Problem with method show in TabPanel in IE8



paweluz
12 Apr 2011, 5:56 AM
Hi

I am using example that is very similar to this one in here:
http://dev.sencha.com/deploy/dev/examples/tabs/tabs-adv.html

Problem is that method show on TabPanel in IE does not show the tab immidiatelly (you may use debbuger in IE on that example to see that). Hole code needs to be loaded. In FireFox when I call method show it immediately shows a new tab in the tab panel - I can see that. In IE it just does not work! It this is just the way that IE works... some rendering issues, or what is the problem? I really need to show this tab immediately in my project.

Can anyone please help me on that?

Regards,
Pawel

Screamy
12 Apr 2011, 6:38 AM
Are you trying to show a hidden tab? Or are you dynamically adding a new object to a TabPanel and it's not showing up as a new Tab immediately?

paweluz
12 Apr 2011, 9:01 AM
Are you trying to show a hidden tab? Or are you dynamically adding a new object to a TabPanel and it's not showing up as a new Tab immediately?

Yes I am creating a dynamic tab. Actually here is the scenario:
- I create new tab with loading map.
- I do some request - loading mask is shown
- when request is over I close this tab and create new one with some specific data. This tab is an object of a new class that I have created, I can not open it with some empty data... so I thought I would open an empty tab, and present loading mask in there. In Firefox it works. I got empty tab with some loading mask, but in IE it just presents me the ending final tab...

Any ideas how to deal with that rendering problem in IE?

Thanks for you r help!

Screamy
12 Apr 2011, 9:23 AM
Any chance you could pare down a functional code sample for us?

paweluz
12 Apr 2011, 9:54 AM
Code looks like that:




var tab1 = new test.tabItem({ // my class with some constructor and initComponent stuff. Data in here is needed!
title: 'Test1',
time: dataTime,
year: yearData,
data: data
});

var myTabPanel = new Ext.TabPanel({
region: 'center',
id: 'TabPanel1',
resizeTabs: false,
minTabWidth: 105,
tabWidth: 215,
activeTab: 0,
enableTabScroll: true,
closable: false,
items: [tab1]
});

myTabPanel.add({
title: 'Loading',
html: '<div id="loadMask1" style="height:100%;width:100%;"><div/>',
closable: true
}).show();
//DOES NOT SHOW IN THE IE!!!!!!!!!!
myMask = new Ext.LoadMask("loadMask1", {
msg: 'Loading...'
});
myMask.show();

var request = OpenLayers.Request.GET({
url: "http://myserver/testing",
async: false
}); // it takes about 3 seconds- loading mask is presented in that time in the tab
var json = new OpenLayers.Format.JSON();
data2 = json.read(request.responseText);

tab2 = new test.tabItem({
title: 'Test2',
time: getTime(data2),
year: getYear(data2),
data: data2
});

myTabPanel.getActiveTab().destroy(); // remove the loading tab
myTabPanel.add(tab2).show(); // add the new tab an show it


It is just about the problem of showing that first tab. Why it does not show in IE?

regards,
Pawel