Working with Pop Ups and Browser Windows in JavaScript - How to access the data available in the main window from within a pop up window and vice versa using JavaScript
(Page 4 of 5 )
The code for the main window would be as follows:
<html>
<head>
<meta name=vs_targetSchema
content="http://schemas.microsoft.com/intellisense/ie5">
<script id="clientEventHandlersJS" language="javascript">
<!--
// global variable for subwindow reference
var w;
function openNewWindow( ) {
if (!w || w.closed) {
w = window.open("","NewWindow","status,height=200,width=300");
// delay writing until window exists in IE/Windows
setTimeout("openNewWindow( )", 50);
} else if (w.focus) {
// window is already open and focusable, so bring it to the front
w.focus( );
}
// write HTML to new window document
w.location.href="HTMLPage7_1.htm";
w.document.close( ); // close layout stream
}
function Button1_onclick() {
openNewWindow();
}
function Button2_onclick() {
document.all.txtParentName.value = w.document.getElementById
("txtName").value;
}
//-->
</script>
</head>
<body>
<form id="form1">
Enter Name:<input id="txtParentName" type=text>
<input type="button" value="Show" id="Button1"
name="Button1" onclick="return Button1_onclick()">
<input type="button" value="Get" id="Button2"
name="Button2" onclick="return Button2_onclick()">
</form>
</body>
</html>
The code for the web page (HTMLPage7_1.htm) for the pop up window would be as follows:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="vs_targetSchema"
content="http://schemas.microsoft.com/intellisense/ie5">
<script id="clientEventHandlersJS" language="javascript">
<!--
function Button1_onclick() {
document.all.txtName.value = opener.document.forms
["form1"].txtParentName.value;
}
function Button2_onclick() {
opener.document.forms["form1"].txtParentName.value =
document.all.txtName.value;
}
//-->
</script>
</head>
<body>
Enter Name:<input id="txtName" type=text NAME="txtName">
<input type="button" value="Show" id="Button1" name="Button1"
onclick="return Button1_onclick()">
<input type="button" value="Show at parent" id="Button2"
name="Button2" onclick="return Button2_onclick()">
</body>
</html>
You can find the explanation for the above code in the next section.
Next: How to access the data available in main window from within a popup window and vice-versa using JavaScript: discussion >>
More JavaScript Articles
More By Jagadish Chaterjee
/ 8 
