DaniWeb IT Discussion Community - JavaScript's window.opener

DaniWeb IT Discussion Community (http://www.daniweb.com/forums/)

- JavaScript / DHTML / AJAX (http://www.daniweb.com/forums/forum117.html)

- - JavaScript's window.opener (http://www.daniweb.com/forums/thread737.html)

JavaScript's window.opener

Hello, I've been trying to find something about why window.opener doesn't work for IE (I'm using 6.0) when I use the window.opener in a separate JavaScript file. It works without any problem when I use Mozilla/Netscape, but not for IE.

The implementations I've seen in my searching for an answer so far, have all been 'in-line' examples how to manage but I haven't found any example yet with separate JavaScript file.

I've got two XHTML documents that are connected to two different JavaScript files:

The first XHTML document:

<?xml version="1.0" encoding="ISO-8859-1"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

   <head>

      <title>Test first window</title>

      <meta http-equiv="Content-Type" content="text/xhtml; charset=iso-8859-1" />

   </head>

   <body>

      <h2>Test first window</h2>

      <hr />

      <div class="left">

         <p>

            Open a new browser window:

            <input id="openNewWindow" type="text" size="55"

               value="commsecondwindow.html" />

            <input id="button1" type="button" value="Open" />

         </p>

         <p>

            Close the browser window:&nbsp;&nbsp;&nbsp;

            <input id="button2" type="button" value="Close" />

         </p>

         <p id="textString">

         </p>

         <p id="timeString">

         </p>

         <p id="testString">

         </p>

      </div>

      <script type="text/javascript" src="commfirstwindow.js"></script>

      <noscript><p>Your browser does not support javascript.</p></noscript>

   </body>

</html>

...and the javascript for it:

// For IE4+

ie=(document.all)?true:false;



// For Mozilla

dom=((document.getElementById) && (!ie))?true:false;



function setEventByID(id, ev, fu) {

   if (dom) {

      document.getElementById(id).addEventListener(ev, fu, false);

   }

   if (ie) {

      document.getElementById(id).attachEvent('on' + ev, fu);

   }

}







var newWindow;



function openNewWindow() {

   var url=document.getElementById('openNewWindow').value;

   newWindow=window.open(url, 'newWindow', '', '');

   newWindow.creator=self;

}

setEventByID('button1', 'click', openNewWindow);





// Close the new window



function closeWindow() {

   if (newWindow!=null) {

      newWindow.close();

   }

}

setEventByID('button2', 'click', closeWindow);

The second XHTML document:

<?xml version="1.0" encoding="ISO-8859-1"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

   <head>

      <title>Test second window</title>

      <meta http-equiv="Content-Type" content="text/xhtml; charset=iso-8859-1" />

   </head>

   <body>

      <h2>Test second window</h2>

      <hr />

      <div class="left">

         <p>

            Send a text to the main window:

            <input id="testText" type="text" size="55"

               value="This is a test text for the main window!" />

            <input id="button3" type="button" value="Send text" />

         </p>

      </div>

      <script type="text/javascript" src="commsecondwindow.js"></script>

      <noscript><p>Your browser does not support javascript.</p></noscript>

   </body>

</html>

...and the javascript code:

// For IE4+

ie=(document.all)?true:false;



// For Mozilla

dom=((document.getElementById) && (!ie))?true:false;



function setEventById(id, ev, fu) {

   if (dom) {

      document.getElementById(id).addEventListener(ev, fu, false);

   }

   if (ie) {

      document.getElementById(id).attachEvent('on' + ev, fu);

   }

}



// Global variables

var initialString="Testing to insert text into main window...";

var initialTextNode=document.createTextNode(initialString);

var timeNode;

var testNode;





window.opener.document.getElementById('textString').appendChild(initialTextNode);





function currentTime() {

   var today=new Date();

   if (timeNode==null) {

      timeNode=document.createTextNode(today.toLocaleTimeString());

      window.opener.document.getElementById('timeString').appendChild(timeNode);

   }

   else {

      window.opener.document.getElementById('timeString').removeChild(timeNode);

      timeNode=document.createTextNode(today.toLocaleTimeString());

      window.opener.document.getElementById('timeString').appendChild(timeNode);

   }

}

window.setInterval(currentTime, 1000);



function sendTestText() {

   var testTheString=document.getElementById('testText').value;

   testNode=document.createTextNode(testTheString);

   window.opener.document.getElementById('testString').appendChild(testNode);

}

setEventById('button3', 'click', sendTestText);

Does anyone know why the above works well with Mozilla/Netscape but doesn't work with IE? Am I doing something wrong in the code?

/Soo-Im

Re: JavaScript's window.opener

Hello, I'll answer my own question...

There was definitely something wrong with my code that I was not aware of until now. When creating the nodes, I also have to use window.opener if it is supposed to work properly. This was hard to detect for me, since IE didn't give any error messages at all about this.

Anyway, the code that works now actually look like this for the second javascript code:

// For IE4+

ie=(document.all)?true:false;



// For Mozilla

dom=((document.getElementById) && (!ie))?true:false;



function setEventByObject(ob, ev, fu) {

   if (dom) {

      ob.addEventListener(ev, fu, false);

   }

   if (ie) {

      ob.attachEvent('on' + ev, fu);

   }

}



function setEventById(id, ev, fu) {

   if (dom) {

      document.getElementById(id).addEventListener(ev, fu, false);

   }

   if (ie) {

      document.getElementById(id).attachEvent('on' + ev, fu);

   }

}



// Global variables

var initialString="Testing to insert text into main window...";

var initialTextNode=window.opener.document.createTextNode(initialString);

var timeNode;

var testNode;



window.opener.document.getElementById('textString').appendChild(initialTextNode);



function currentTime() {

   var today=new Date();

   if (timeNode==null) {

      timeNode=window.opener.document.createTextNode(today.toLocaleTimeString());

      window.opener.document.getElementById('timeString').appendChild(timeNode);

   }

   else {

      window.opener.document.getElementById('timeString').removeChild(timeNode);

      timeNode=window.opener.document.createTextNode(today.toLocaleTimeString());

      window.opener.document.getElementById('timeString').appendChild(timeNode);

   }

}

window.setInterval(currentTime, 1000);



function sendTestText() {

   var testTheString=document.getElementById('testText').value;

   testNode=window.opener.document.createTextNode(testTheString);

   window.opener.document.getElementById('testString').appendChild(testNode);

}

setEventById('button3', 'click', sendTestText);

/Soo-Im

Re: JavaScript's window.opener

hi, i have the same problem as you, but i don't understand how do you fix it.
This works fine with firefox, but not in IE that is where has to work (political bussiness:(

I post here my problem...

/function that opens the new window
function openFaqList() {
for (i=0; i<document.sendFaq.isbooked.length;i++) {
if (document.sendFaq.isbooked[i].checked && document.sendFaq.isbooked[i].value=='yes')
WindowObjectReference = window.open("faqList.asp?booked=1","FAQ","width=420,height=230,resizable,scrollbars=yes,status=0");
if (document.sendFaq.isbooked[i].checked && document.sendFaq.isbooked[i].value=='no')
WindowObjectReference = window.open("faqList.asp?booked=0","FAQ","width=420,height=230,resizable,scrollbars=yes,status=0");
}
}

... html code ...
--> here the function is called
<a href="javascript:openFaqList()" class="faq-link-2">[Select]</a>
... html code ...

==> code for the new window opened
(javascript section)
var listaFAQs="";
var i;
for (i=0;i<document.selectFAQ.elements.length;i++)
if (document.selectFAQ.elements[i].type == 'checkbox') //comprobamos que el objeto es un checkbox
if (document.selectFAQ.elements[i].checked) // introducimos en un vector las FAQs seleccionadas
if (listaFAQs == "") {
listaFAQs=listaFAQs+document.selectFAQ.elements[i].name;
}
else {
listaFAQs=listaFAQs+","+document.selectFAQ.elements[i].name;
}
// pagina que tratara los datos
alert(listaFAQs);
opener.document.forms[0].action="customer_support.asp?vengode=popup&selectedfaqs="+listaFAQs;
opener.document.forms[0].submit();
// se cierra la ventana
window.close();

...
==> here we want to go back to the parent window with the selection done in this window
response.write("<form name=selectFAQ action='javascript:faq2send_selected();' method='post'>")
cont=1
rs.MoveFirst

while not rs.eof
response.write("<input type='checkbox' value='" & rs("faq_id") & "' name='checkbox_"& rs("faq_id") &"'>"&cont&". "&rs("title_en")&"<br>")
rs.movenext
cont=cont+1
wend
response.write("<INPUT TYPE=SUBMIT VALUE='Hecho'></form>")
...

Thanks !!!