• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 314
  • Last Modified:

Passing values between parent and popup using Javascript

I am trying to do the following using Javascript, and I was hoping someone might be able to provide basic code (using two html pages and javascript functions) to accomplish it:

1) Use HTML form to collect a parameter or two from user
2) Pass that data to Popup window
3) Display that data in the popup window
4) Write something (i.e. "Successful") to parent window when user clicks button on popup (and close popup as well).

Thanks!
0
tso11
Asked:
tso11
1 Solution
 
aisebastianCommented:
Hi,

This is how i did it... It works on most browsers.

This is how i changed values of fields in parent windows, based on input in child popup

You can send data to child via GET parameters with PHP, or program the child popup to collect the data as shown below from the parent onload.
object = window.opener.document.getElementById('id_of_field')
object.value = 'new value of field';

Open in new window

0
 
me655321Commented:
Here's an example of how I do it...this is two files...the second one should be named testnew.html
<html> 
<head> 
<script>
var passVariable;
function openWindow(){
	passVariable = document.getElementById("textbox").value;
	window.open("testnew.html");
}
</script> 
</head> 
<body> 
<div id="sentbackdiv"></div>
<input id="textbox" type="text" value="test" />
<input type="button" value="Send text to new window" onclick="openWindow()" />
</body> 
</html>

HERE'S THE NEW WINDOW FILE("testnew.html")

<html>
<head>
<script>
function sendBack(){
	opener.document.getElementById("sentbackdiv").innerHTML = "Value passed back is: " + document.getElementById("textbox").value;
	window.close();
}
</script>
</head>
<body>
<div id="sentdiv"></div>
<script>
	document.getElementById("sentdiv").innerHTML = "Value passed is: " + opener.passVariable;
</script>
<input id="textbox" type="text" value="test back" />
<input type="button" value="Send text to back to parent." onclick="sendBack()" />
</body>
</html>

Open in new window

0
 
tso11Author Commented:
Worked perfect!  Thanks!
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now