Guida su Ajax . Lezione 1 Introduzione

Senza tanti preamboli vediamo subito che cosa è realmente Ajax.

• La capacità di Javascript di aggiornare parte di una pagina HTML senza che questa venga caricata nuovamente.
• La capacità di Javascript di fare richieste tramite il protocollo HTTP.

Che cosa è il linguaggio di programmazione Ajax

in pratica quando si parla di Ajax è l’acronimo di Asynchronous JavaScript And XML ed è una tecnologia che risale al 2005. Non si tratta di una nuova tecnologia né di un’invenzione bensì di un concetto utilizzato per sviluppare applicativi avanzati e particolari quali Gmail, Google Maps o Google Suggest. Il concetto è in parte espresso nell’acronimo scelto, un utilizzo asincrono di Javascript che attraverso l’interfacciamento con XML, può permettere ad un client di richiamare informazioni lato server in modo veloce e trasparente, allargando gli orizzonti delle rich internet applications.

In pratica questa nuova invenzione riguarda principalmente il linguaggio HTML che prima ne era sprovvisto , di fatto poi è stato utilizzato anche da tutte le altre tecnologie vedi Aspnet , ma piu’ per moda che per altro, dato che le stesse utilizzavano gia’ le tecnologie alternative che permettevano di ottenere una comunicazione client server di tipo asincrono…

Ma vediamo piu’ in particolare su cosa si basa questa asincronia. Prima quando facevamo le normali pagine statitiche che di fatto si potevano fare anche in php, una volta che il server aveva caricato nel nostro browser e la pagina questa di fatto era statica, anche se realiazzata in php, in quanto per potere modificare i dati in essa presenti dovevamo ricaricare l’intera pagina senza possibilità di fare altrimenti, con questa nuova tecnologia Ajax è invece possibile ricaricare solamente alcuni dati della pagina senza la necessità di ricaricarla per intero. Quindi si perde la sincronia fra quello che richiediamo noi , ossia una pagina web e la comunicazione del server. Questo è in soldoni quello che accade, per darvi un esemplio proprio esplicito possiamo parlarvi delle chat che una volta caricata la pagina, esse aggiornano la pagina stessa, prima con php era possibile farlo solamente ad istanti sincroni , ossia dopo determinati periodi di tempo prestabiliti, ora con Ajax l’aggiornamento avviene quando un utente immette un messaggio nella chat, cioe’ si perde totalmente la sincronia, dato che non è possibile stabilire esattamente quando un utente decide di immettere unovamente un nuovo messaggio.

Facciamo un primo esempio, guardate questo messaggio

<script>
 function script1() {
 var e = document.getElementById("pluto");
 e.innerHTML = "Benone!";
 }
 </script>
 <div id="pluto">
 Ciao come stai?
 </div>
 <input type="button" value="Esegui esempio" onClick="script1()" />

e provatelo

Osserviamo il codice esempio e ad utilizzarlo (basta premere il bottone Esegui esempio). Alla pressione del bottone il contenuto dell’elemento DIV che ha come id pluto viene modificato da “Come stai” a “Benone!”. Guardando il codice si capisce subito che farlo è molto semplice, questa è la funzione script1 che viene richiamata alla pressione del pulsante: