AJAX – Responsetext is blank without alertbox

Hello Everyone,

I am stuck in a weird AJAX problem and its been sometime I have tried fixing it. I am doing a simple AJAX call on my PHP page. Here is the Javascript that is [B]not working[/B]:

[CODE]
var http_request = false;
function makePOSTRequest(url, parameters, eid) {

http_request = false;

if (window.XMLHttpRequest) { // Mozilla, Safari,…
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
// set type accordingly to anticipated content type
//http_request.overrideMimeType(‘text/xml’);
http_request.overrideMimeType(‘text/html’);
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject(“Msxml2.XMLHTTP”);
} catch (e) {
try {
http_request = new ActiveXObject(“Microsoft.XMLHTTP”);
} catch (e) {}
}
}
if (!http_request) {
alert(‘Cannot create XMLHTTP instance’);
return false;
}
http_request.open(‘POST’, url, true);
http_request.setRequestHeader(“Content-type”, “application/x-www-form-urlencoded”);
http_request.setRequestHeader(“Content-length”, parameters.length);
http_request.setRequestHeader(“Connection”, “close”);
http_request.send(parameters);
http_request.onreadystatechange = alertContents(eid);
}

function alertContents(id) {
// alert(http_request.readyState); //commented
if (http_request.readyState == 4) {
if (http_request.status == 200) {
result = http_request.responseText;
document.getElementById(id).innerHTML = result;
} else {
//alert(‘There was a problem with the request.’);
}
}else{
}
}
[/CODE]

And here is the Javascript that works:

[CODE]
var http_request = false;
function makePOSTRequest(url, parameters, eid) {

http_request = false;

if (window.XMLHttpRequest) { // Mozilla, Safari,…
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
// set type accordingly to anticipated content type
//http_request.overrideMimeType(‘text/xml’);
http_request.overrideMimeType(‘text/html’);
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject(“Msxml2.XMLHTTP”);
} catch (e) {
try {
http_request = new ActiveXObject(“Microsoft.XMLHTTP”);
} catch (e) {}
}
}
if (!http_request) {
alert(‘Cannot create XMLHTTP instance’);
return false;
}
http_request.open(‘POST’, url, true);
http_request.setRequestHeader(“Content-type”, “application/x-www-form-urlencoded”);
http_request.setRequestHeader(“Content-length”, parameters.length);
http_request.setRequestHeader(“Connection”, “close”);
http_request.send(parameters);
http_request.onreadystatechange = alertContents(eid);
}

function alertContents(id) {
[COLOR=”Red”]alert(http_request.readyState);[/COLOR] //uncommented
if (http_request.readyState == 4) {
if (http_request.status == 200) {
result = http_request.responseText;
document.getElementById(id).innerHTML = result;
} else {
//alert(‘There was a problem with the request.’);
}
}else{
}
}
[/CODE]

The responsetext is received properly if I put this [B]alert(http_request.readyState);[/B] statement. Also, it shows me the value 1 which means that the object is initializing but not loaded or completed. After I click ok on the alertbox the responsetext is outputed correctly. I also checked the value of readystate after the alertbox and it shows me 4. So, this clearly means that it is taking time for the readystate to attain the completion and a value of 4.

Surprisingly, if I try to set a delay by using setTimeout(‘alert(http_request.readyState)’,5000) then the readystate changes to 4 but it still won’t give out the right responsetext. It is blank. I even checked the value of http_request.status and it comes out to be 200. Then why the code is not working? It only works when I use alert(http_request.readyState); only as given in the above code snippet.

Any ideas guy what is happening? Any help will be really appreciated.

Thanks.

Also in #JavaScript _↴