PDA

View Full Version : Tab Panel, need help please



glasgowboy84
4 Feb 2008, 3:20 PM
I am using a Tab panel with an Iframe in each of the Tabs, it works except when I re-click on the Tab it doesn’t reload the Iframe.

I have attached the code I use below, can any help me out, with something like on tab reload or on click reload refresh, any help would great thanks.

Jon
:)





MyDesktop.TabWindow = Ext.extend(Ext.app.Module, {
id:'tab-win',
init : function(){
this.launcher = {
text: 'Customer Manager',
iconCls:'accordion',
handler : this.createWindow,
scope: this
}
},

createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('tab-win');
if(!win){
win = desktop.createWindow({
id: 'tab-win',
title:'Customer Manager',
width:800,
height:600,
iconCls: 'tabs',
shim:false,
animCollapse:false,
border:false,
constrainHeader:true,
deferredRender: false,
layoutOnTabChange:true,
layout: 'fit',
items:
new Ext.TabPanel({
deferredRender: false,
layoutOnTabChange:true,
activeTab:2,
defaults:{autoScroll:true},


items: [{
title: 'Customer List',
body: new Ext.ux.ManagedIFrame({autoCreate:{ src:'evolution_adminScreen.asp?navPath=0a8a3e53-166e-102b-8e61-f758d217f99c', frameBorder: 0, cls:'x-panel-body ',width: '100%', height: '100%'}}),
header:false,
border:false,
autoScroll: false
},{
title: 'Customer',
body: new Ext.ux.ManagedIFrame({autoCreate:{ src:'evolution_adminScreen.asp?navPath=0a8a3ee4-166e-102b-8e61-f758d217f99c', frameBorder: 0, cls:'x-panel-body ',width: '100%', height: '100%'}}),
header:false,
border:false,
autoScroll: false
},{
title: 'Customer Orders',
body: new Ext.ux.ManagedIFrame({autoCreate:{ src:'evolution_adminScreen.asp?navPath=0a8a3f2c-166e-102b-8e61-f758d217f99c', frameBorder: 0, cls:'x-panel-body ',width: '100%', height: '100%'}}),
header:false,
border:false,
autoScroll: false
},{
title: 'Contracts Deals',
body: new Ext.ux.ManagedIFrame({autoCreate:{ src:'evolution_adminScreen.asp?navPath=0a8a3f73-166e-102b-8e61-f758d217f99c', frameBorder: 0, cls:'x-panel-body ',width: '100%', height: '100%'}}),
header:false,
border:false,
autoScroll: false
}]
})
});
}
win.show();
}
});

Condor
5 Feb 2008, 12:15 AM
Reload the iframe in the activate event handler.

ps. Why are you using a Panel with a ManagedIframe instead of a ManagedIframePanel?

glasgowboy84
5 Feb 2008, 5:56 AM
Ok I have taken your advice and used the (ManagedIframePanel) which is a lot better. My code below.

I am still struggling to add a function on tab activate (each time the tab is clicked) to reload the (IFRAME) or (REFRESH)

Can you someone please give me a sample on how it would look, sorry but am just really struggling with this one.


May Thanks for your help! :)

Jon Hood


MyDesktop.IframeWindow = Ext.extend(Ext.app.Module, {
id:'iframe-win',
init : function(){
this.launcher = {
text: 'Customer Manager List',
iconCls:'tabs',
handler : this.createWindow,
scope: this
}
},

createWindow : function(){
var desktop = this.app.getDesktop();
var win = desktop.getWindow('tab-win');
if(!win){
win = desktop.createWindow({
id: 'tab-win',
title:'Customer Manager',
width:900,
height:600,
iconCls: 'tabs',
shim:false,
animCollapse:false,
border:false,
constrainHeader:true,

layout: 'fit',
items:
tab = new Ext.TabPanel({
activeTab:'IF3',
deferredRender:true,
plain:true,
layoutOnTabChange:true,

defaults:{
autoScroll: true
,border:false
,loadMask:true,
closable:true,
loadMask:true
},

items: [{
title: 'Customer List',
id:'id1',
xtype:'iframepanel',
loadMask:{msg:'<img src="images/powered.png" height="35px" width="99px" />'},
defaultSrc:'evolution_adminScreen.asp?navPath=0a8a3e53-166e-102b-8e61-f758d217f99c'

},{
title: 'Customer Manager',
id:'id2',
xtype:'iframepanel',
loadMask:{msg:'<img src="images/powered.png" height="35px" width="99px" />'},
defaultSrc:'evolution_adminScreen.asp?navPath=0a8a3ee4-166e-102b-8e61-f758d217f99c'

},{
title: 'Customer Orders',
id:'id3',
xtype:'iframepanel',
loadMask:{msg:'<img src="images/powered.png" height="35px" width="99px" />'},
defaultSrc:'evolution_adminScreen.asp?navPath=0a8a3f2c-166e-102b-8e61-f758d217f99c'

},{
title: 'Customer Manager',
id:'id4',
xtype:'iframepanel',
loadMask:{msg:'<img src="images/powered.png" height="35px" width="99px" />'},
defaultSrc:'evolution_adminScreen.asp?navPath=0a8a3f73-166e-102b-8e61-f758d217f99c'

}]
})
});
}
win.show();
}
});