By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
444,190 Members | 1,503 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 444,190 IT Pros & Developers. It's quick & easy.

IFRAME CloneNode does not clone its contents?

P: 1
Hi,

I really really need help in trying to figure out how can I do a CloneNode on an Iframe where the cloned IFRAME clones with all its contents?. Basically what I am doing is dynamically building a table with Iframes inside it. The problem is I just want to build one Iframe because the contents of it can be very complex. After my Iframe is built I just want to clone the iframe as many times as I need later. I cannot use an HTML file and point the src of the Iframe to it. I have to put into the Iframe a very dynamic HTML document I get back form an Ajax call. This is truly the key of the problem. Since my pages can be complicated it can take around 2000ms to render. I don’t want to make each Iframe render every time when I already have the document ready to display. I just want to clone it very fast. I can not use the ‘scr’ of the iframe.


Here is a very simple example of my problem. Look near the end of the code to see the problem. Try this code and you can see the IFRAME does not Clone its contents. Is there any way around this problem? Please note that I also cannot use innerHTML to populate the cloned Iframe with my master Iframe’s contents. Because if I do this the page still takes 2000ms to render when the HTML in the Iframe is very complicated. I just want this thing to clone as it is. Thanks in advance.

[HTML]<html>
<head>
</head>
<body>
<script language="JavaScript">

function getIFrame(frameName)
{
for (var i=0; i<frames.length; i++)
{
if (frames[i].name == frameName)
return frames[i];
}
return null;
}

// Create Table via DOM
var TABLETAG = document.createElement('TABLE');
TABLETAG.border = "1";

// Create Table body tag
var TBODYTAG=document.createElement('TBODY');
TABLETAG.appendChild(TBODYTAG);

// Create Table TR Tag
var TRTAG = document.createElement('TR');
TBODYTAG.appendChild(TRTAG);

// Create Table TD Tag
var TDTAG = document.createElement('TD');
TRTAG.appendChild(TDTAG);

// Append Table to Body
window.document.body.appendChild(TABLETAG);

// Create an Iframe
var MyIFrame = document.createElement('<iframe name="MyIframe">');
MyIFrame.setAttribute('width','100');
MyIFrame.setAttribute('height','100');
MyIFrame.setAttribute('src','about:blank');

// Append IFRAME To TD
TDTAG.appendChild(MyIFrame);

// Get acces to Iframe now attached ot body so
// I can add HTML code in it.
var MyIFrame = getIFrame('MyIframe');
MyIFrame.document.designMode='On';
MyIFrame.document.open();
MyIFrame.document.write("<div>f</div>");
MyIFrame.document.close();
MyIFrame.document.designMode='Off';

//**************************************
// ** Here is the problem. When the Table node
// is Cloned the IFrame does not clone its contnents.
// Help!!!!!***
//*************************************
TRTAG.appendChild(TDTAG.cloneNode(true));
TRTAG.appendChild(TDTAG.cloneNode(true));
TRTAG.appendChild(TDTAG.cloneNode(true));
TRTAG.appendChild(TDTAG.cloneNode(true));

</script>

</body>
</html>[/HTML]
Jul 27 '06 #1
Share this Question
Share on Google+
1 Reply


acoder
Expert Mod 15k+
P: 16,027
To clone iframe contents, use importNode instead of cloneNode.
Jun 9 '08 #2

Post your reply

Sign in to post your reply or Sign up for a free account.