I’m trying to implement some AJAX on my server but I get in some kind of a jam and would like your opinion on it.
Here’s the code
// holds an instance of XMLHttpRequest
var xmlHttp = createXmlHttpRequestObject();
// holds the remote server address and parameters
var serverAddress = "scripts/directory.php?";
// variables that establish how often to access the server
var updateInterval = 5; // how many seconds to wait to get new message
var errorRetryInterval = 30;
// when set to true, display detailed error messages
var debugMode = true;
// creates and XMLHttpRequest instance
function createXmlHttpRequestObject()
{
// will store the reference to the XmlHttpRequest object
var xmlHttp;
// this should work for all browsers except IE6 and older
try
{
// try to create XmlHttpRequest object
xmlHttp = new XMLHttpRequest();
}
catch(e)
{
// assume IE6 or older
var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0",
"MSXML2.XMLHTTP.5.0",
"MSXML2.XMLHTTP.4.0",
"MSXML2.XMLHTTP.3.0",
"MSXML2.XMLHTTP",
"Microsoft.XMLHTTP");
// try every prog id until one works
for (var i=0; i<XmlHttpVersions.length && !xmlHttp; i++)
{
try
{
// try to create XmlHttpRequest object
xmlHttp = new ActiveXObject(XmlHttpVersions*);
}
catch(e) {}
}
}
// return the created object or display an error message
if (!xmlHttp)
alert("Error creating the XMLHttpRequest object.");
else
return xmlHttp;
}
// function that displays a new message on the page
function display($message)
{
// obtain a reference to the <div> element on the page
myDiv = document.getElementById("myMessage");
// display message
myDiv.innerHTML = $message + "<br/>";
}
// function that display an error message
function displayError($message)
{
// display error message, with more technical details if debugMode is true
display("Un problème est survenue lors de la recherche du nom! Nouvelle tentative dans " +
errorRetryInterval + " secondes." +
(debugMode ? "<br/>" + $message : ""));
// restart sequence
setTimeout("process();", errorRetryInterval * 1000);
}
// call server asynchronously
function process()
{
var xmlHttp = createXmlHttpRequestObject();
// only continu if xmlHttp isn't void
if (xmlHttp)
{
// try to connect to server
try
{
// remove this line if you don't like the 'Receiving...' message
display("Recherche en cours...");
serverAddress = serverAddress + "findBy=" + document.getElementById("findBy").value +
"&pattern=" + document.getElementById("pattern").value;
// make asynchronous HTTP request to retrieve new message
xmlHttp.open("GET", serverAddress, true);
xmlHttp.onreadystatechange = handleGettingDirectory;
xmlHttp.send(null);
}
catch(e)
{
displayError(e.toString());
}
}
}
// function called when the state of the HTTP request changes
function handleGettingDirectory()
{
display("0");
// when readyState is 4, we are ready to read the server response
if (xmlHttp.readyState == 4)
{
display("1");
// continue only if HTTP status is "OK"
if (xmlHttp.status == 200)
{
display("2");
try
{
display("3");
// do something with the response from the server
getDirectory();
}
catch(e)
{
// display error message
displayError(e.toString());
}
}
else
{
// display error message
displayError(xmlHttp.statusText);
}
}
}
// function that handle the response received from the server
function getDirectory()
{
// retrieve the server's response
var response = xmlHttp.responseText;
// server error?
if (response.indexOf("ERRNO") >= 0
|| response.indexOf("error") >= 0
|| response.length == 0)
throw(response.length == 0 ? "Server error." : response);
// display the message
display(response);
//restart sequence
setTimeout("process()", updateInterval * 1000);
}
Right now it goes all the way to the handleGettingDirectory but never get the readystate ==4, what is wrong??
thanks for the help.
Cheers