Active Client Pages: the Script Approach - A Simple Example
(Page 4 of 4 )
I will use a simple example to illustrate the approach. In this example, you have a frameset with only one frame. There is JavaScript in the HEAD element of the frameset. This script has permanent variables (and can also have functions). The page (document) of the frame has an Input Text control. The frame page also has a script in its HEAD element.
When the frame is loaded, this script reads a value, “John,” of a variable from the frameset JavaScript and displays it in the Input Text control of the frame document. At the bottom of the frame page, a JavaScript is loaded. This script contains another content of the frame; that is, this script contains the next page. This content in the script will replace the present content of the frame, to give us the second document (page).
The frameset document and HTML file for the frame are downloaded at the same time. The frame document has an Input Text control. The onload event of the BODY element of the frame copies the value “John” of the variable from the frameset JavaScript into the Input Text control of the frame document.
There is an HTML button on the frame document. When you click it, you see the next page. This is the code of the frameset and the content of the first page. It needs explanation.
<html>
<head>
<script type="text/javascript">
var theArray = new Array()
theArray[0] = "<head>";
theArray[0] += "<script type="text/javascript">";
theArray[0] += "function giveValue()";
theArray[0] += "{";
theArray[0] += "document.getElementById('FN').value = parent.defaultValue;";
theArray[0] += "}";
theArray[0] += "</script>";
theArray[0] += "</head>";
theArray[0] += "<body onload=giveValue()>";
theArray[0] += "<label for="FN">First Name</label> <input type="text" id="FN"> <br />";
theArray[0] += "<button type="button" onclick="parent.pInx = 1;location.replace('myChild.htm')">Display Second
Page</button>";
theArray[0] += "<script src="forNextPage.js"></script>";
theArray[0] += "</body>";
var pInx = 0;
var defaultValue = "John";
</script>
</head>
<frameset cols="100%,*">
<frame src="myChild.htm" name="myChild">
</frameset>
</html>
We shall have the explanation in the next section.
I have given you a lot for this part of the series. Let us take a break and continue in the next part of the series.
| DISCLAIMER: The content provided in this article is not warranted or guaranteed by Developer Shed, Inc. The content provided is intended for entertainment and/or educational purposes in order to introduce to the reader key ideas, concepts, and/or product reviews. As such it is incumbent upon the reader to employ real-world tactics for security and implementation of best practices. We are not liable for any negative consequences that may result from implementing any information covered in our articles or tutorials. If this is a hardware review, it is not recommended to open and/or modify your hardware. |
