Ajax è una tecnica di sviluppo che permette lo scambio di dati in background tra browser e server web. Nasce dall’esigenza innanzitutto di aggiornare dinamicamente parti della pagina visualizzata dall’utente e per elaborare informazioni senza che queste interferiscano con la navigazione dell’utente.

L’uso di Ajax si cala in numerose situazione, tuttavia l’80% di chi utilizza questa tecnica lo fa innanzitutto per aggiornare un div, un paragrafo o comunque un blocco della pagina.
Per chi ha esperienza con Javascript e sa dove “mettere le mani”, realizzare ciò che è stato appena descritto risulta essere un lavoro abbastanza semplice ma alla lunga noioso; d’altro canto per chi è a digiuno di programmazione lato Client può risultare difficile e non di immediata comprensione realizzare un aggiornamento dinamico con Ajax.
A tale scopo ho riunito in alcune funzioni il cuore di Ajax dando vita ad uno script che ho chiamato AJAX GO.
La funzione ajax_go, opportunamente richiamata, permette a chiunque di implementare la tecnica Ajax evitando la scrittura di ulteriore codice. Basta includere il file ajax_go.js e chiamare la funzione quando risulta necessario.

Ad esempio se intendo aggiornare il contenuto di un div con id=’my_box’, chiamando uno script lato server (ad esempio codice.php) che restituisca il “nuovo” codice html da inserire nel div, chiamerò la funzione ajax_go così:

ajax_go('codice.php','my_box');

// Parametri della funzione:
// ajax_go(url dello script lato server,id del blocco html)

Per utilizzare da subito la funzione è necessario richiamare il codice, aggiungendo la riga sottostante nell’head html della pagina che utilizzerà Ajax:

<script type="text/javascript" src="http://www.donatantonio.net/script/ajax_go.js"></script>

Oppure è possibile scaricare Ajax Go(con un esempio di utilizzo) da qui…

Oppure puoi testare un esempio di utilizzo di Ajax Go cliccando qui…

Ecco invece il codice completo per chi è interessato:

/* 
    AJAX GO - AJAX SEMPLICE E VELOCE
    Fabio Donatantonio 2010 - http://www.donatantonio.it/
*/
var myRequest = null;
var the_box = null;

function CreateXmlHttpReq(handler) {
 	var xmlhttp = null;
	try {
    	xmlhttp = new XMLHttpRequest();
  	}catch(e){
    try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    }catch(e){
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
  xmlhttp.onreadystatechange = handler;
  return xmlhttp;
}

function aggiornamento() {
    e = document.getElementById(the_box);
    if (myRequest.readyState == 4 && myRequest.status == 200) {
        e.innerHTML = myRequest.responseText;
    }
}

function ajax_go(url,id_box) {
    the_box = id_box;
    var r = Math.random();
    if(url.indexOf("?")==-1)
        url = url + "?rand="+escape(r);
    else
        url = url + "&rand="+escape(r);
    myRequest = CreateXmlHttpReq(aggiornamento);
    myRequest.open("GET",url);
    myRequest.send(null);
}

SINTASSI: ajax_go(url dello script lato server, id del blocco html);