Popup window accessing parent dom

Question

I have a popup window that needs to access the parent dom to generate a print page. The structure of the print page is significantly different then the structure of the parent so a print css would not solve the problem. I basically want to popup a window and then have that window grab some data from the parent of even access the dom from the popup and generate the print page without having to go to the server again. Any ideas how i can achieve this?

Im using the standard

window.open()

to pop up a window. I need this solution to not be a hack and be cross browser compatible with all major browsers.

Thanks in advance!

Answer 1

Sajjan's answer is a start, but better make sure your objects are available before you try to access them:

var opener = window.opener;
if(opener) {
    var oDom = opener.document;
    var elem = oDom.getElementById("your element");
    if (elem) {
        var val = elem.value;
    }
}

Otherwise, you do run the risk that the opener doesn't respond to your initial call, and that you can't get the element from it.

As jQuery, I think (based on an answer, here: how to access parent window object using jquery?):

var opener = window.opener;
if(opener) {
    var elem = opener.$("#elementId");
    if (elem) {
        var val = elem.val(); // I forgot we're dealing with a jQuery obj at this point
    }
}

Answer 2

window.opener.document.getElementById("your element").value

Answer 3

According to MDN, window.open() will return you a handle to the new window.

var popUpHandle = window.open();

With this handle you should be able to access the DOM of the PopUp. It is possible vice-versa using the already mentioned window.opener. Refer again to MDN:

var originalWindow = window.opener;

Still, your favorite search engine will provide you more details, as this is topic is fairly old and your approach has already been done a million times or more.

Answer 4

parent.document helped in my case.

var elem = parent.document.getElementById("overlay_modal");
if (elem) {
alert('setting attribute');
elem.setAttribute("onclick", "Windows.close('2', event);");
}