E finalmente Ajax:
Codice PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Our wonderful AJAX page!</title>
<script language="javascript" type="text/javascript">
function DOMize(element)
{
if(!element.addEventListener)
{
element.addEventListener=function(event,listener)
{
event="on"+event;
if(this.attachEvent)
{
this.attachEvent(event,listener);
}
else
{
this[event]=listener;
}
}
};
if(!element.removeEventListener)
{
element.removeEventListener=function(event,listener)
{
event="on"+event;
if(this.detachEvent)
{
this.detachEvent(event,listener);
}
else
{
delete this[event];
}
}
};
return element;
};
function getPage(){
var xmlhttp=false; //Clear our fetching variable
try {
xmlhttp = new ActiveXObject('Msxml2.XMLHTTP'); //Try the first kind of active x object…
} catch (e) {
try {
xmlhttp = new
ActiveXObject('Microsoft.XMLHTTP'); //Try the second kind of active x object
} catch (e) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest(); //If we were able to get a working active x object, start an XMLHttpRequest
}
var file = 'query.php?page=';
//This is the path to the file we just finished making *
var sel = document.getElementsByTagName("select")[0];
var whatinfo = sel.options[sel.selectedIndex].value;
xmlhttp.open('GET', file + whatinfo, true); //Open the file through GET, and add the page we want to retrieve as a GET variable **
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4) { //Check if it is ready to recieve data
var content = xmlhttp.responseText; //The content data which has been retrieved ***
if( content ){ //Make sure there is something in the content variable
if(test = document.getElementById("paragraph")) {
document.getElementById("target").removeChild(test);
}
var info = document.createElement("p");
info.setAttribute("id", "paragraph");
var text = document.createTextNode(content);
info.appendChild(text);
document.getElementById("target").appendChild(info);
}
}
}
xmlhttp.send(null) //Nullify the XMLHttpRequest
return;
}
window.onload = function()
{
var sel = document.getElementsByTagName("select")[0];
DOMize(sel).addEventListener("change",getPage, false);
}
</script>
</head>
<body>
<form method="get">
<select name="choosepage">
<option value="">Choose page</option>
<option value="uno">Page One</option>
<option value="due">Page Two</option>
</select>
</form>
<div id="target"></div>
</body>
</html>
Mi sembra che inizi ad essere decente come implementazione
come si dice da cosa nasce cosa basta iniziare .......
un pezzetto di quà un'altro di là