Sometimes, you need to call a JavaScript function that’s in a parent window from a child window. For example, suppose you wanted to update a field in the parent window when a user enters or selects some value in a child window.

You can achieve this using the window DOM object’s window.opener property, which holds a reference to the parent window object model. After you have the parent window reference, you can access any functions, variables, or controls in the parent window.

Assume that parent window code (in the file ParentPage.htm) contains the following function and variable declaration:

<script language="javascript">var aVariable = 'some value';function Func1(){   //some code goes here}

Additional code on that page opens a child window called ChildPage.htm, which can call the Func1 function in the parent window using:

window.opener.Func1();

Note that you can also pass parameters to Func1() in the same way you do for any other JavaScript function.

To access the aVariable variable defined in the parent window code, enter the following:

window.opener.aVariable;

Controls work the same way. To access a control with the id aControl, use:

window.opener.aControl;

One caveat–window.opener can be null, so when you use it, always check to ensure that it is not null, and also ensure that the parent window is not closed, by using the window.opener‘s closed property. You can check both with one line of code:

if(window.opener != null && !window.opener.closed){   //some code goes here.}