Javascript AJAX function not loading
I had a simple realtivley ajax application that I broke up to be more modular. The code is from the link below, and what I basically did was add the GetRecordSet function and allow fetchcompelte to accept the variable for which the layer should put data. It should work fine in thery. When I put alert () in, the code seems to execute, except inside any of the if clauses in fetchcomplete.
http://www.nomorepasting.com/getpaste.php?pasteid=22558
This is the code for get_records.php which again seems like it should be fine
http://www.nomorepasting.com/getpaste.php?pasteid=22559
and this is the original php index file
source to share
I would agree with Shyam and also install Firebug for Firefox; this will be a huge help for javascript debugging.
anyway, the line
xmlHttp.onreadystatechange = FetchComplete(layername);
will assign the result FetchComplete(layername)
xmlHttp.onreadystatechange
you don't need. It should be
xmlHttp.onreadystatechange = FetchComplete;
But then you have a transmission problem layername
.
If you define onreadystatechange as an anonymous inner function, you can easily use variables defined outside of it, so you can do something like this:
function GetAuctionData(pk) {
var xmlHttp=GetXmlHttpObject();
var layer = "Layer2";
if(xmlHttp==null) {
alert("Your browser is not supported?");
}
var url="get_auction.php?";
url=url+"cmd=GetAuctionData&pk="+pk;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange = function() {
if(xmlHttp.readyState==4 || xmlHttp.readyState=="complete") {
document.getElementById(layer).innerHTML=xmlHttp.responseText
} else if (xmlHttp.readyState==1 || xmlHttp.readyState=="loading") {
document.getElementById(layer).innerHTML="loading"
}
};
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
layer
defined as a local variable in GetAuctionData (), but available in an anonymous function because you are creating a Closure. Please note that I have not tested the above function, but it should work in principle.
source to share
I would assume you are using prototypejs from http://www.prototypejs.org , which will abstract away all the state checks of your code and make it simpler and get rid of the clutter.
If for some reason you prefer to use your own code, avoid using string values for the readyState property of the XMLHttpRequestObject. Use the following table instead
State Description
0 The request is not initialized
1 The request has been set up
2 The request has been sent
3 The request is in process
4 The request is complete
and check.
source to share