...
PDA

Passing DOM nodes between windows

bjornrud
02-21-2005, 03:56 PM
Hey everyone, I'm at wits end. The following code works as expected in Firefox but IE says "No such interface suppported"

Basically, the first codeblock is a parent window to the second codeblock which is supposed to send two nodes back to the parent and display them. Any help would be GREATLY appreciated.

Edit: I almost forgot. I found this thread before
http://www.codingforums.com/showthread.php?t=51978&highlight=No+such+interface+supported
but adding .cloneNode(true) didn't fix the problem. Am I using it wrong?

<html>
<head>
<title>parent DOM test</title>
<SCRIPT language="Javascript1.1">
function insertPassed(arrayOfNodes){
targetDiv = document.getElementById('childTarget'); //cloneNode didn't help here.
for(i=0; i < arrayOfNodes.length; i++){
foolProof = arrayOfNodes[i].cloneNode(true);
targetDiv.appendChild(foolProof); //"No such interface supported" error here in IE
}
}
</SCRIPT>
</head>
<body>
<div id="childTarget"><a href="#" onclick="window.open('test.php','');">popup</a>
</div>
</body>
</html>

<html>
<head>
<title>child DOM test</title>
<script language="Javascript1.1">
function copyInsert(){
meat1 = document.getElementById('a3').cloneNode(true);
meat2 = document.getElementById('a5').cloneNode(true);
toSend = [meat1, meat2];
opener.insertPassed(toSend);
}
</script>
</head>
<body>
<div class="takefromme">
<div class="record" id="a3">
<input type="checkbox" name="records[]" value="3">
<div class="id">
<div class="rLabel" >ID</div>
<div class="rValue">3</div>
</div>
<div class="pbd">
<div class="rLabel" >name</div>
<div class="rValue">Tor</div>
</div>
<div class="altText">
<div class="rLabel" >Alt Text</div>
<div class="rValue">fooo moo</div>
</div>
<div class="name">
<div class="rLabel" >color</div>
<div class="rValue">blue</div>
</div>
</div>
<div class="record" id="a5">
<input type="checkbox" name="records[]" value="5">
<div class="id">
<div class="rLabel" >ID</div>
<div class="rValue">5</div>
</div>
<div class="pbd">
<div class="rLabel" >name</div>
<div class="rValue">Tor5</div>
</div>
<div class="altText">
<div class="rLabel" >Alt Text</div>
<div class="rValue">foo</div>
</div>
<div class="name">
<div class="rLabel" >color</div>
<div class="rValue">red</div>
</div>
</div>
<div class="record" id="a9">
<input type="checkbox" name="records[]" value="9">
<div class="id">
<div class="rLabel" >ID</div>
<div class="rValue">9</div>
</div>
<div class="pbd">
<div class="rLabel" >name</div>
<div class="rValue">Ryan</div>
</div>
<div class="altText">
<div class="rLabel" >Alt Text</div>
<div class="rValue">flowers</div>
</div>
<div class="name">
<div class="rLabel" >color</div>
<div class="rValue">pink</div>
</div>
</div>
</div>
<button onclick="copyInsert();"> Hit me! </button>
</body>
</html>
liorean
02-21-2005, 07:10 PM
Do you think you could create a minimal testcase page for us online? It's make testing easier.

As a probable cause for the problem though: Nodes always belong in their document of creation. A node in one document can't directly be moved into another document, it has to be imported. Internet Explorer doesn't support the importation part of the DOM specs, and my guess is that this goes deeper than just lacking the importNode method.. Moz does, and in this case I believe that cloneNode does an implicit importation. (Otherwise you'd have to import the node before you clone it for it to work.)
bjornrud
02-21-2005, 07:55 PM
Do you think you could create a minimal testcase page for us online? It's make testing easier.

Sure. The codeblocks are at a demo page (http://brainscat.com/test/test.php) now.

While I'd prefer to go about it by copying nodes... If the actual node copying is indeed the problem, I *could* always get the info from the child page and pass it as some basic jscript object to the parent page and then just create a nodes, no?
Kor
02-24-2005, 09:05 AM
...this is probably one of the rare cases where the non-standard innerHTML might be superior to the DOM clone/append methods... ;)
liorean
02-24-2005, 11:05 AM
Well, you'll probably need some form of serialisation. A custom JScript object is one way to go, but as Kor noted, serialisation to a string through the innerHTML property is probably the best way with the least work..
Kor
02-24-2005, 11:14 AM
I wonder... Could such an object (a cloned Node) be brought to a string?
Something like
var stringObj = String(object) ?

Or into a textNode which will include also all the HTML tags as strings?
(except using innerHTML)
liorean
02-24-2005, 11:31 AM
If you wrote a serialisation function, yes it could. Since you're talking about adding it in browsers that don't support importation, and said browsers don't expose the objects these nodes are instances of, you can't make it automagically casting when necessary, though. Mozilla has it's XMLSerialiser and DOMParser objects that can do this work for you as well as the proprietary ContextualFragment. Opera 8 has DOM3LS that you can use. Safari I don't know about, but the 2.0 version might have some surprises in the DOM arena.
Kor
02-24-2005, 11:45 AM
can you point me out to some link examples somewhere on web?
ErroneousBee
03-17-2005, 10:28 AM
For what its worth, I abandoned my attempt to create a dockable node, the IE crash and a lack of examples in other web pages suggested it was not trivially possible.

One thought I never followed up on was to move the node through a DocumentFragment object.

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum