jquery ajax

Oggi vediamo come effettuare chiamate Ajax utilizzando il famoso framework jQuery. Per prima cosa scarichiamo jQuery dal sito ufficiale e includiamo il file nella nostra pagina web:

<script type="text/javascript" src="jquery.js"></script>

Ora diamo un’occhiata al file PHP al quale faremo la richiesta con Ajax. Il file PHP riceverà un ID integer e ci restituirà una risposta in formato testo, risposta, che visualizzeremo nel div con ID univoco “output“:

<?php
(int)$id = $_GET["id"];
if ($id==1) echo "Chiamata numero 1";
if ($id==2) echo "Chiamata numero 2";
if ($id==3) echo "Chiamata numero 3";
if ($id!=1 && $id!=2 && $id!=3) echo "Parametro non valido!";
?>

Ecco che, con poche righe jQuery, possiamo effettuare la richiesta:

<script type="text/javascript">
$.ajax({
type: "GET",
url: "test.php",
data: "id=1",
success: function(response){
$("#output").html(response);
}
});
</script>

Modificando il valore del parametro id in data, magari inserendo dati in input tramite un form, visualizzeremo il messaggio opportuno a seconda del parametro inviato, in questo caso, un numero intero (1,2 o 3). La risposta testuale fornita dal file PHP è contenuta nel parametro response e la visualizziamo nel div output tramite la riga:

$("#output").html(response);

Questo è un semplice esempio ma, con altrettanta semplicità, potremo realizzare applicazioni complesse senza scrivere un’infinità di righe di codice grazie a un potente framework come jQuery 😉

NO SPAM. Non fornirò la tua email a terzi e riceverai solo contenuti che ti interessano sugli argomenti che tratto e potrai cancellarti quando vuoi con un link che trovi in tutte le email.