Hey,
Here is a script I found on the web: http://sanalksankar.blogspot.co.nz/2010/02/ajax-class-object-javascript-simple.html
Code:
function ajaxRequest(url, method, postData) {
//validation start
if (url == undefined) return false;
this.method = method == undefined ? "GET" : method.toUpperCase();
if (this.method != "GET" && this.method != "POST") return false;
if (url == undefined || url == "") return false;
//validation end
this.url = url + ((url.indexOf('?') > 0) ? "&ajts" : "?ajts") + new Date().getTime();
var mainCls = this;
this.inProgress = false;
this.xmlHttpObj = null;
this.postData = postData;
this.toString = function() { return "Ajax by Sanal"; }
this.abort = function() {
if (mainCls.inProgress) {
mainCls.xmlHttpObj.abort();
mainCls.inProgress = false;
mainCls.xmlHttpObj = null;
}
}
this.execute = function(statusChangeFunction) {
try {
// Firefox, Opera 8.0+, Safari
mainCls.xmlHttpObj = new XMLHttpRequest();
}
catch (e) {
// Internet Explorer
try {
mainCls.xmlHttpObj = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
mainCls.xmlHttpObj = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {
return false; //No support for AJAX
}
}
}
mainCls.xmlHttpObj.onreadystatechange = function() {
if (statusChangeFunction) {
statusChangeFunction(mainCls.xmlHttpObj.readyState, typeof (mainCls.xmlHttpObj.responseText) == "unknown" ? null : mainCls.xmlHttpObj.responseText, typeof (mainCls.xmlHttpObj.responseXML) == "unknown" ? null : mainCls.xmlHttpObj.responseXML, mainCls.xmlHttpObj.readyState==4 ? mainCls.xmlHttpObj.status : null);
}
if (mainCls.xmlHttpObj.readyState == 4) {
mainCls.inProgress = false;
mainCls.xmlHttpObj = null;
}
}
mainCls.xmlHttpObj.open(mainCls.method, mainCls.url, true);
if (mainCls.method == "POST") {
mainCls.xmlHttpObj.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
mainCls.xmlHttpObj.setRequestHeader("Content-Length", mainCls.postData.length);
}
mainCls.inProgress = true;
mainCls.xmlHttpObj.send(mainCls.method == "POST" ? mainCls.postData : null);
return true;
}
}
I cant seem to get the post side of it to work… seems the entire page reloads and no variable are captured…
My code to access the class:
function testAjax() {
var myAjaxRequest = new ajaxRequest("ajaxcall.php","POST","key1=value1&key2=value2");
myAjaxRequest.execute(processMyRequest);
myAjaxRequest = null;
}
function processMyRequest(readyState, responseText) {
if (readyState == 4)
document.getElementById("myDIV").innerHTML = responseText;
else if (readyState == 1)
document.getElementById("myDIV").innerHTML = "Loading...";
}
My Form:
<form action="" id="myform" method="post">
<input name="fname" type="text" id="fname"/>
<br />
<input name="lname" type="text" id="lname" />
<input name="submit" type="submit" onClick="testAjax()" />
</form>
<div id="myDIV"> </div>
What am I doing wrong?
Thanks