JAVASCRIPT

Active Client Pages: More Questions and Answers on Chrys`s Approach

This is the third part of my series, "Active Client Pages: Chrys’s Approach." We continue to learn the roots that give rise to my approach to Active Client Pages. We will also answer more questions about the technique and its capabilities.

Author Info:

By: Chrysanthus Forcha

Poor Best

Rating:

/ 1

July 17, 2009

TABLE OF CONTENTS:

Yes, but you have to know what to do. The master document, the second document or any document loaded, can use Ajax to load data or JavaScript in advance. When Ajax is used, the server should send the data or JavaScript code as a string. Note that any code sent as a string can still contain data. You will then have to use the top level JavaScript eval() function to transform the string code into normal code and automatically integrate it with the rest of the JavaScript on the page.

In the following example, when the button is clicked, a new page will be loaded (opened). While the page is on the screen, JavaScript code is downloaded as a string by Ajax. The eval() function takes this code as a string and integrates it as normal code with the rest of the page. When the button is clicked, it uses this integrated code to produce the new page. This is the code for the document.

<html>

<head>

var evalStr = "";

</script>

</head>

<body>

This is a page.<br />

var xmlHttp;

try

{

// Firefox, Opera 8.0+, Safari

xmlHttp=new XMLHttpRequest();

}

catch (e)

{

// Internet Explorer

try

{

xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");

}

catch (e)

{

try

{

xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");

}

catch (e)

{

alert("Your browser does not support AJAX!");

}

xmlHttp.onreadystatechange=function()

{

if(xmlHttp.readyState==4)

{

evalStr = xmlHttp.responseText;

}

xmlHttp.open("GET","sendText.pl",true);

xmlHttp.send(null);

eval(evalStr);

</script>

</body>

</html>

This example has classic Ajax code. The code string is downloaded in advance without the user being conscious of it. In this example the file at the server that will send the string code is sendText.pl. The example assumes that this file and the web page are in the same directory. The evalStr variable is the one that holds the code string. Note the use of the eval() function at the bottom of the example.

The code string sent from the server is equivalent to the following:

"function showNewPage()"

+ "{"

+ "var thePage = document.open();"

+ "thePage.write("This is a new page.");"

+ "thePage.close();"

+ "}"

So what the eval() function fits into the script is:

function showNewPage()

{

var thePage = document.open();

thePage.write("This is a new page.");