JAVASCRIPT

Working with Pop Ups and Browser Windows in JavaScript

This series of articles mainly concentrates on working with browser windows and sub-windows in JavaScript. You can reuse these scripts to inject into server side controls easily (especially in .NET and Java).

Author Info:

By: Jagadish Chaterjee

Poor Best

Rating:

/ 10

April 25, 2006

TABLE OF CONTENTS:

· Working with Pop Ups and Browser Windows in JavaScript
· How to write to a pop up window dynamically using JavaScript
· How to access the data available in a pop up window from within the main window using JavaScript
· How to access the data available in the main window from within a pop up window and vice versa using JavaScript
· How to access the data available in main window from within a popup window and vice-versa using JavaScript: discussion

<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">

            </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>