By vaseline28 on Sep 13, 2008I find that lots of people new to AJAX can't get the grips because they don't understand the XMLHttpRequest, below is a help to that - this will handle the request, all that you have to fill in is the Commands to be executed when the content is got.
You also have to add in where to get the content from, but it is explained in comments :-)
function ajaxXML_requestCreate()
{
// Detect Browser for XMLHttpRequest (IE uses a different method to other browsers)
var xmlHttpForm;
if (navigator.appName == "Microsoft Internet Explorer")
xmlHttpForm = new ActiveXObject("Msxml2.XMLHTTP");
else
xmlHttpForm = new XMLHttpRequest();
return xmlHttpForm;
}
// This section calls the AJAX Request when the page loads so that we don't have to use it again.
var xmlHttp = ajaxXML_requestCreate();
function ajaxXML_Request()
{
/* Where to get the content from, with this - you are given several choices:
xmlHttp.open("GET",URL_ofPage,true);
You can specify "GET" or "POST" for $_GET or $_POST methods. URL_ofPage is where the URL of the page to get the data from should be put. */
http.onreadystatechange = ajaxResponse(locat);
// Replace 'locat' with the id the response must go to.
xmlHttp.send(null);
}
function ajaxResponse(locat)
{
// Variable: locat :is the id of the location you want the response to go to.
if(xmlHttp.readyState!=4)
{
/* Commands in this section of the script will be triggered when the content is being fetched, but has not come through yet.
For example, you might want to put in:
document.getElementById('locat').innerHTML="**Content loading...please wait**"; */
}
else
{
var response = http.responseText;
// Commands to be done with the content retrieved
// The variable in which the response is stored is 'response'
}
}
Looking better vaseline, but there is still some room for improvement. Your ajaxXML_Request() function should take URL_ofPage as an input so a dynamic document URL can be called. It would also be helpful to see the HTML code to call this. And finally, your spacing is a bit off with the brackets not lining up properly.
Mmmm, I've got round the problem by doing:
echo "<body onload=" . $qt . "ajaxGenerate_Content('ajaxContent_generate','/Site/ajaxCon/" . $_GET['value'] . ".php?mthd=AJAX')" . $qt . ">";
Obviously with a case for if $_GET['value'] is not a recognised file, that way someone can link to a specific page with:
http://www.vasey.co.cc/Site/?value=Scripting
That's very true, another way to do it would be to add in a Javascript script to pages like this:
http://omega.neeq.net/home.php
So if the URL is that it will redirect them to:
http://omega.neeq.net/?page=/home.php
It's also a pain to make it work for Search Engine crawls...
lol, thanks!
Such as; you can't link people to it. it's still http://omega.neeq.net even if you're on downloads page. now to me, that's no biggy cos if you're linking out as the admin, i've made a function;
?page=/pagename
Thanks jonesy :)
I'm starting to get the hang of it, so if you do need help, feel free to let me know...'course there are no guarantees that I can ACTUALLY help you!
Edit: I've added in:
if(xmlHttp.readyState!=4)
{
// Commands in this section of the script will be triggered when the content is being fetched, but has not come through yet.
// For example, you might want to put in:
// document.getElementById('example').innerHTML="**Content loading...please wait**";
}
This script is taken from my webpage which is currently in development - you can see the extent of even very basic AJAX here: http://www.vasey.co.cc/Site/
You don't really need to get xmlHttp every time an AJAX call is made. That can be done outside the function upon page load. I also think you should have done onreadystatechange to a function that handles the response, like this:
...
element = 'mydiv';
xmlHttp.onreadystatechange = handleResponse;
xmlHttp.send(null);
function handleResponse()
{
if(xmlHttp.readyState == 4)
{
var response = xmlHttp.responseText;
document.getElementById(element).innerHTML = response;
}
}
This example will only work if xmlHttp and 'element' are declared globally.