How to call a Javascript function from another window?

RO

Rodie

0 1
Asked
Viewed
56.7k times

I have a webpage that opens a new window and attempts to call a function that is declared in this new window:

new_window = window.open("page2.php", "window2", "height=120");
new_window.test();

Here is the body of page2.php:

<body>
  <script language="javascript">
    function test() {
      alert("in test...");
    }
  </script>
</body>

The new window is correctly opened, but the function call does not work! It says:

Object does not support this property or method.

I know I suck but I really cannot figure out the problem here. Thanks for your help 🙂

add a comment
0

3 Answers

  • Votes
  • Oldest
  • Latest
CA

Carnix

17 2
Answered
Updated

This is how you would do it. Passing function arguments is tricky when the function isn't on the same page as the calling statement because of the way functions and variables work in relation to the window object, but its not impossible. I show a very simply way of doing this, but you can certinaly expand it.

test.html:

<html>
<head>
<script LANGUAGE="JavaScript" TYPE="text/javascript">
	function openWindow(){
		WREF = window.open("test2.html","test2",'width=550,height=650');
		if(!WREF.opener){ WREF.opener = this.window; }
	}

	function getValue(val){
		newVal =  5 * val;
		return newVal;
	}

	var globalGetValue = this.getValue;

</script>
</head>

<body>
<a HREF="javascript:void(0);" onClick="openWindow();">Open the window</a>
</body>
</html>

test2.html:

<html>
<head>
</head>
<body>
<script LANGUAGE="JavaScript" TYPE="text/javascript">
document.write("This is 5 x 7: " + opener.globalGetValue(7));
</script>
</body>
</html>

Just be careful not to call the function BEFORE the window is fully loaded, perhaps by using a callback logic that forces your parent script to wait until the child window executes and alters a variable.

var callbackvar = false;
var sleepcount = 0;
while(!callbackvar){
  sleepcount++;
}

then in your child, you'll have, as the last thing that happens when the page loads, something that does opener.callbackvar = true;

Then, the parent can communicate with a fully loaded child window. You'll need to test and tweek this... I'm writing off the cuff without testing anything... This while loop will run away if you're not careful... for testing, put a more defined end-state in like:

var callbackvar = false;
var sleepcount = 0;
while(!callbackvar || sleepcount > 100000){
  sleepcount++;
}
  • 0
    Indeed your code works, however, I would like the parent window to call a JS function in the child window (what you did is the contrary). Anyway, your stuff is useful 🙂 — Rodie
  • 0
    Oh 😳 Sorry, I misread the question. The same sort of logic should apply. You can't simply call functions outside the document without making them into global objects that operate at the window level instead of the document level. — Carnix
  • 0
    Indeed I also noticed the problem of loading time (lost my hair on it before figuring it out). The problem I get is that I wrote a simple test with buttons and I call functions by hitting those buttons (so plenty of time to load). From the children to the parent, the function call works (with "opener"...) but from the child to the parent, NO. That's what I cannot figure out! Right now there is no function call in my code anymore, I work directly on the HTML component of the child page from the parent page. Thanks a lot lot lot for your help, very useful! 😛 — Rodie
add a comment
1
SM

SevenMentor

0 2
Answered
Updated

You can call a function from the child window by adding the window.opener object to it.

window.opener.FUNCTION()

You can reload the page with

window.opener.reload();
add a comment
1
FO

FullOfQuestions

0 0
Answered
Updated

Why not just have the function execute in the new window??

new_window = window.open("page2.php", "window2", "height=120"); 

<head>
<script language="javascript"> 
    function test() { 
      alert("in test..."); 
    } 
    </script> 
</head>
<body onLoad="test()"> 
</body>
  • 0
    The code I gave is a simplification of my problem. I cannot call the function from the parent page after I load the new page. Any thoughts on why the function call does not work? — Rodie
add a comment
0