PDA

View Full Version : Safari - iframe in content panel issue(complex layout)



brian
16 Mar 2007, 11:24 AM
Safari - Mac OS X 10.4.8 build 8L127, 1GHZ PowerBook G4 2GB RAM

An iframe in the complex layout works as expected in FireFox2, but is not working in Safari. Is this a bug, or is this an error on my part(and should be posting this in help?)

http://bordee.com/images/screenshots/SafariScreenSnapz002.jpghttp://bordee.com/images/screenshots/FirefoxScreenSnapz003.jpg

using the stock complex example and adding:



newCenter:function(){
layout.add('center', new Ext.ContentPanel('center3',{fitToFrame:true, title: 'New iFrame', autoCreate: {tag:'iframe', src: 'http://www.google.com',id: 'center3', frameborder:'no'}}));
}

and to the the north region:

New iFrame Panel (#)

JeffHowden
16 Mar 2007, 3:44 PM
I suspect it may be a problem with your code as I'm dynamically generating iframes as contentpanels on Safari without any issues. However, I am nesting the iframe in a div that I'm then setting as a contentpanel. This requires more markup but seems to have positive performance implications when lots of tabs are involved.

Here's the relevant portion of code from an addPanel method we use.


var wrapper = document.createElement('div');
wrapper.id = id;
var iframe = document.createElement('iframe');
iframe.setAttribute('frameborder', 'no');
iframe.frameBorder = 0;
iframe.setAttribute('name', id + '-frame');
iframe.setAttribute('id', id + '-frame');
wrapper.appendChild(iframe);
document.body.appendChild(wrapper);
iframe.src = url;
panel = layout.add('center', new Ext.ContentPanel(id , {
title: title
, closable: true
, fitToFrame: true
, resizeEl: id + '-frame'
})
);

brian
16 Mar 2007, 4:18 PM
Thanks Jeff! I appreciate the help. I'll let you know how it turns out.

brian
18 Mar 2007, 3:52 PM
Ok, got it working with your code. I generated the new panel first, because the user has the option of using it for something that doesn't require an iframe. Thanks again!:D

BTW: Do you ever experience andy quirks when resizing in safari? If so, I have made a post here http://www.yui-ext.com/forum/viewtopic.php?t=3816, please take a look when you have a chance.



panel = Ext.get(id+'-panel');
var wrapper = document.createElement('div');
wrapper.id = id+'-wrapper';
var iframe = document.createElement('iframe');
iframe.setAttribute('frameborder', 'no');
iframe.frameBorder = 0;
iframe.setAttribute('name', id + '-panneliframe');
iframe.setAttribute('id', id + '-panneliframe');
wrapper.appendChild(iframe);
panel.appendChild(wrapper);
ifr = Ext.get(id+'-panneliframe');
wrp = Ext.get(id+'-wrapper');
wrp.fitToParent(true);
ifr.fitToParent(true);
iframe.src = url;