Using the JavaScript keyword Eval() with AJAX makes it possible to dynamically add JavaScript code at run-time to your web page.
Here's the complete code dynalert.html, dynalert.js, and dynalert.cgi
file:dynalert.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>dynalert</title>
<meta http-equiv="Content-Type" content="type=text/html; charset=ISO-8859-1" />
<script type="text/javascript" src="dynalert.js"></script>
</head>
<body>
<p id="i1">123 </p><input type="button" value="go" onclick="update()" />
</body>
</html>
file: dynalert.js
function populatePage(results){
eval(results);
}
//send the update
function update() {
var strServer = "dynalert.cgi";
url2 = "";
SubmitRBData(strServer,"?" + url2);
}
function SubmitRBData(strUrl, strPostFields) {
http.open("GET", strUrl + strPostFields, true);
http.onreadystatechange = handleHttpResponse;
http.send(null);
}
function handleHttpResponse() {
if (http.readyState == 4) {
if (http.status == 200)
{
results = http.responseText;
populatePage(results); // string response
}
}
}
function getHTTPObject() {
var objXMLHttp=null
if (window.XMLHttpRequest)
{
objXMLHttp=new XMLHttpRequest()
}
else if (window.ActiveXObject)
{
objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")
}
return objXMLHttp
}
var http = getHTTPObject(); // We create the HTTP Object
file:dynalert.cgi
require 'cgi'
cgi = CGI.new
puts "Content-Type: text/html"
puts
puts "function transcript(){ alert('and Bob said this idea might work.');}"
puts "alert('this is a success');"
puts "alert('we can now pass back anything we like');"
puts "transcript();"
puts "oNew = document.createElement('strong');"
puts "oNew.innerHTML = 'yes - this is bold text';"
puts "document.getElementById('i1').appendChild(oNew);"
