window.opener is not working

Question

I'm working on a webpage that opens up a popup child window by clicking an image on the parent window.

And I would like to pass the value from the child window's text box to the parent window's text box.

I have found a tutorial on this topic and followed his method. http://www.plus2net.com/javascript_tutorial/window-child3-demo.php However it didn't work for me.

$(document).ready(function(){
  $("#myImg").click(function(){   
    var win1=window.open("popupWindows/p1.html","myWindow"," top=500, left=500, width=500,height=500");
    });
});

^ This opens up the child window.

function childWindowFunction()
{
opener.document.getElementById("parentTextBox").value=document.getElementById("userInput").value;
//alert(document.getElementById("userInput").value); <-- this works
//alert(opener.document.getElementById("parentTextBox").value); <-- not working at all
close();
}

^ This executes from the child window.

And here is the executable code. https://www.dropbox.com/s/83hwyhbz7u4nuie/sandbox.7z

I guess the opener.document.getElementById("parentTextBox").value is not working. Can someone tell me what's wrong? Thank you!

---

Ignore the code above. I have created a jsfiddle for this. jsfiddle.net/yuyhero/6FKVM/1

I would like to use button inside the popup window to do the task instead of using the get value button from the parent window.

Now that the button inside the popup window does not work at all.

Thanks for your help!

Answer 1

Imagine for a moment that you use window.open to create "myWindow" and then from within "myWindow" you use window.open to create "windowTheSequel".

You now have two "openers", eg the original browser window and "myWindow". Therefore, opener wouldn't know which window to reference without the child (myWindow) as a reference.

So begin the line with myWindow.opener... and you should be good to go.