Is it possible to pass a DOM node from an iframe to the parent in IE?

Logos

I'm having trouble with this in IE; annoyingly it works beautifully in
FF. My keywords are not specific enough to narrow my search to useful
entries on google, way too many hits, so here I am again.

What I want is to take an element from an inline frame and transfer it
to the parent for insertion into the parent document for display. This
works just fine in FF, but of course craps out in IE. Does anyone know
if there is a way to do this?

Code in parent:
function appendMe(node) {
node.style.background='red';
var here =document.getElementById("divInfoBar");
here.appendChild(node);
}

Code in iframe, launched via onload:
function fuggoff() {
var bugger =document.getElementById("test");
parent.appendMe(bugger);
}

Demo at http://65.110.86.247/Product_List3.asp. It is supposed to pass
a DIV out of the iframe, turn the background red (that works fine) and
then append it to the parent's DOM (which should automatically decouple
it from the iframe's DOM). The IE error message is "Error: invalid
argument" for here.appendChild(node).

Tyler

Jun 29 '06 #1

Subscribe Post Reply

3442

Logos

PS: creating a new node and copying the innerHTML seems to work, but
it doesn't grab anything set programmatically, dammit... For instance,
if I set the passed node' background to red, then copy innerhtml to a
new node and append it to the parent document, the appended node isn't
red.

Tyler

Jun 29 '06 #2

Martin Honnen

Logos wrote:

What I want is to take an element from an inline frame and transfer it
to the parent for insertion into the parent document for display. This
works just fine in FF, but of course craps out in IE. Does anyone know
if there is a way to do this?
The proper way to do that is to use the W3C DOM Level 2 method
importNode e.g. you would do
function appendMe(node) {
node.style.background='red';
var here =document.getElementById("divInfoBar");
here.appendChild(node);

here.appendChild(here.ownerDocument.importNode(nod e, true));

Mozilla and Opera (8 and later) support importNode, only Opera 8
requires it (as the W3C DOM suggests). The importNode works like a
cloneNode, only that it allows you to clone a node to be inserted in a
new owner document. So depending on your aims you would also need to
remove the node you have cloned from the other document e.g.
node.parentNode.removeChild(node)

IE is too old to support anything like W3C DOM Level 2 and has also no
own comparable APIs on nodes, you would be forced to go back to the more
IE 4 like "HTML string" insertion stuff e.g.
here.insertAdjacentHTML(
'beforeEnd',
node.outerHTML
);

W3C DOM Level 3 Core also has an adoptNode method that allows you to
move (not clone) a node from one document to another. I think Opera 9
supports that so there you could do e.g.
here.appendChild(here.ownerDocument.adoptNode(node ));

--

Martin Honnen
http://JavaScript.FAQTs.com/

Jun 30 '06 #3

Logos

IE is too old to support anything like W3C DOM Level 2 and has also no
own comparable APIs on nodes, you would be forced to go back to the more
IE 4 like "HTML string" insertion stuff e.g.
here.insertAdjacentHTML(
'beforeEnd',
node.outerHTML
);

Bummer. So it's not possible then. I also tried iterating thru all
the properties of the iframe node use a for loop to copy them to the
new node, but it errors out after copying just two properties! Very
annoying :(

Tyler

Jun 30 '06 #4

BootNic

> "Logos" <ty*********@gmail.com> wrote:

news:11**********************@b68g2000cwa.googlegr oups.com....

IE is too old to support anything like W3C DOM Level 2 and has
also no own comparable APIs on nodes, you would be forced to go
back to the more IE 4 like "HTML string" insertion stuff e.g.
here.insertAdjacentHTML(
'beforeEnd',
node.outerHTML
);

Bummer. So it's not possible then. I also tried iterating thru all
the properties of the iframe node use a for loop to copy them to the
new node, but it errors out after copying just two properties! Very
annoying :(

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">
function iframeImportNode(frameID,nodeID){
var frame,myNode,nod,fdiv;
if(!(document.body.innerHTML&&
document.cloneNode&&
document.getElementById&&
document.createElement&&
window.frames))
{
window.location="http://www.opera.com";
alert('Upgrade Required');
return document.body;
}
frame=window.frames[frameID];
myNode=frame.document.getElementById(nodeID);
nod=document.createElement('div');
fdiv=frame.document.createElement('div');
fdiv.appendChild(myNode.cloneNode(true));
nod.innerHTML=fdiv.innerHTML;
return nod.firstChild;
}
function point(){
window.frames['ifrm'].document.write('<p id="myP" style="color:blue;'+
'cursor:pointer;text-decoration:underline;" onclick="alert(\'done\')">'+
'blank page</p>');
window.frames['ifrm'].document.close();
}
flo=(window.attachEvent)?window.attachEvent('onloa d', point):
window.addEventListener("load", point, false);
</script>
<title>iframeImportNode</title>
<meta http-equiv="content-type" content=
"text/html; charset=windows-1252">
</head>
<body>
<div id="pannel1">
<iframe id="ifrm" name="ifrm" src="about:blank"></iframe>
</div>
<button
onclick="document.body.appendChild(iframeImportNod e('ifrm','myP'))">
Insert node from Iframe</button>
</body>
</html>

--
BootNic Friday, June 30, 2006 7:19 PM

When I was young, I was put in a school for retarded kids for two
years before they realized I actually had a hearing loss...and they
called ME slow!
*Kathy Buckley*

Jun 30 '06 #5

Logos

Cool! Doesn't work on IE5.5 tho...trying to decide if I should support
the 4% of the people who visit using IE5 or not...tempting to just say
screw 'em...

Tyler

BootNic wrote:

"Logos" <ty*********@gmail.comwrote:
news:11**********************@b68g2000cwa.googlegr oups.com....

IE is too old to support anything like W3C DOM Level 2 and has
also no own comparable APIs on nodes, you would be forced to go
back to the more IE 4 like "HTML string" insertion stuff e.g.
here.insertAdjacentHTML(
'beforeEnd',
node.outerHTML
);
Bummer. So it's not possible then. I also tried iterating thru all
the properties of the iframe node use a for loop to copy them to the
new node, but it errors out after copying just two properties! Very
annoying :(

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript">
function iframeImportNode(frameID,nodeID){
var frame,myNode,nod,fdiv;
if(!(document.body.innerHTML&&
document.cloneNode&&
document.getElementById&&
document.createElement&&
window.frames))
{
window.location="http://www.opera.com";
alert('Upgrade Required');
return document.body;
}
frame=window.frames[frameID];
myNode=frame.document.getElementById(nodeID);
nod=document.createElement('div');
fdiv=frame.document.createElement('div');
fdiv.appendChild(myNode.cloneNode(true));
nod.innerHTML=fdiv.innerHTML;
return nod.firstChild;
}
function point(){
window.frames['ifrm'].document.write('<p id="myP" style="color:blue;'+
'cursor:pointer;text-decoration:underline;" onclick="alert(\'done\')">'+
'blank page</p>');
window.frames['ifrm'].document.close();
}
flo=(window.attachEvent)?window.attachEvent('onloa d', point):
window.addEventListener("load", point, false);
</script>
<title>iframeImportNode</title>
<meta http-equiv="content-type" content=
"text/html; charset=windows-1252">
</head>
<body>
<div id="pannel1">
<iframe id="ifrm" name="ifrm" src="about:blank"></iframe>
</div>
<button
onclick="document.body.appendChild(iframeImportNod e('ifrm','myP'))">
Insert node from Iframe</button>
</body>
</html>

--
BootNic Friday, June 30, 2006 7:19 PM

When I was young, I was put in a school for retarded kids for two
years before they realized I actually had a hearing loss...and they
called ME slow!
*Kathy Buckley*

Jul 3 '06 #6

Similar topics

Nested Coalescing possible in SQL?

by: Jeff Lanfield | last post by:

First of all, I apologize if coalescing is not the right term to describe my problem. I have a tree where each node has the same set of attributes (is the same entity) but child nodes should...

Microsoft SQL Server

Filter XML to pass to XSL and import into my control?

by: darrel | last post by:

I'm still struggling to figure out the big-picture concept of how to go about building a web site menu from an xml file. The XML file contains the full site structure (the site map, so-to-speak)....

.NET Framework

Refresh Parent from iframe Page_Load

by: Jeronimo Bertran | last post by:

Hi, I have a page with a very data intensive grid which needs to be automatically refreshed constantly if a change is detected. In order to not refresh the complete page so often, I created an...

ASP.NET

Pass events or data to IFRAME

by: Peter | last post by:

I have a webform on this form is a User Control and another webform in IFRAME On the User Control there is a save button. I want to click this button and somehow tell the webpage in IFRAME that...

ASP.NET

Get IFrame Reference

by: Angel | last post by:

How do I get the reference of the IFrame from the asp.net webpage that is being displayed within that IFrame? In other words I have an IFrame in my page. Within that IFrame Set the source to a...

ASP.NET

A Challenge: Call parent Javascript function from inside an iframe?

by: Chris Ianson | last post by:

Hi geniuses (or is that genii, or genies) The challenge is as above really. I have a page with an iframe in it, and need to call a JS function in the *parent* page, *from* inside the iframe. ...

Javascript

Set Parent Scroll Position - parent page and iframe on seperate domains

by: PD | last post by:

I have a parent .Net page (http://mywebsite/project.aspx) that has an iframe (http://iframe/iframe.aspx) which are on seperate domains. I need to adjust the scrolling on the parent window due the...

Javascript

Event control between iFrame and parent window

by: Jayyde | last post by:

Is there any way to capture a button click inside an iFrame and perform both an action on that page and one on the parent page? Basically I have a page atm that allows the user to add a record to...

Javascript

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

Windows Server

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

Microsoft Access / VBA