Script ajax: Esempio base ajax con ahah

difficoltà:      

Script simili

23/9/2007

Abbiamo visto nei precedenti articoli come utilizzare ajax con la libreria script.aculo.us. Vedremo in questo articolo l'uso di un'altra libreria che non contiene tutti gli effetti di script.aculo.us, ma se dobbiamo solamente utilizzare chiamate asincrone è molto comoda per la sua leggerezza. La libreria in questione è ahah.

Come dice l'autore:

AHAH è una recente libreria che costituisce un'alternativa ad AJAX. In pratica è come avere delle include dinamiche di codice html senza effettuare il re-load delle pagine. Non necessita quindi di parsing XML così come avviene invece per AJAX ma si basa invece su inclusioni asincrone di codice html che possono provenire da file statici o da elaborazioni complicate server-side.

La libreria completa è scaricabile qui. Una volta scaricata la libreria inseriamo il file nella cartella ahah.
Ora ripropongo l'esercizio proposto per capire l'uso ajax base e l'uso di ajax base con script.aculo.us. Con questo semplice script  invieremo via querystring  una variabile ad una pagina, la quale elaborerà il risultato, che verrà scritto in un div della pagina.

Il file res.php resta uguale. Questo file si occupa di prelevare il valore inviato via querystring, rielaborarlo, e darci il testo che verrà poi inserito nella nostra pagina che effettua la chiamata:

<?
header("Content-type:text/html;charset=iso-8859-1");
$secretword = $_GET['w'];
echo "<p>La parola inserita è <b>$secretword</b>.</p>";

?>

Nel file che effettua la chiamata avremo:

<script src="ahah/ahahText.js"></script>

<script type="text/javascript" language="javascript">
	function makeRequest(){
	completeAHAH.ahah('res.php?w=script', 'result', '', 'GET', '');
	}
</script>

<a href="javascript:void(null)" onclick="makeRequest()">
        Make a request
</a>

<div id="result"></div>

Il risultato sarà che il div result sarà riempito con la frase:

<p>La parola inserita è <b>script</b>.</p>

La sintassi della funzione è:

completeAHAH.ahah(url, target, delay, method, parameters)

dove:

url è la pagina da richiamare in modo asincrono
target è l'id del div da aggiornare
delay il ritardo
method metodo di invio: get o post
parameters l'elenco dei parametri nel formato var1=xxx&var2=yyy (solo per invii post, per il get inserire le variabili nell'url come nell'esempio.

Esempio invio GET:

completeAHAH.ahah('res.php?w=script', 'result', '', 'GET', '');

Esempio invio POST:

completeAHAH.ahah('res.php', 'result', '', 'POST', 'w=script');

---

Lascia un commento

Nome:

Email/Link:

Testo*:

I campi contrassegnati con * sono obbligatori.