|
In questo tutorial AJAX completeremo la spiegazione dell'esempio visto nel tutorial precedente.
Analizzeremo il lato server di un programma ajax, in particolare del programma che da suggerimenti all'utente in tempo reale
mentre quest'ultimo stà scrivendo in una casella di input.
Dal codice del tutorial precedente concentriamoci sulle seguenti righe:
.......
function showHint(str)
{
if (str.length > 0)
{
var url="suggerisci.php?sid=" + Math.random()
+ "&q=" + str
xmlHttp=GetXmlHttpObject(stateChanged)
xmlHttp.open("GET", url , true)
xmlHttp.send(null)
}
........
Nel codice sopra viene richiamato il server di gestione della richiesta mediante il suo url, suggerisci.php.
Le cose da notare sono 2:
Le richiesta viene fatta utilizzando il metodo GET
A "suggerisci.php" passo la stringa da elaborare mediante la variabile "q"
Qual'è l'interfaccia del server con il mondo esterno?
E' importante capire come avviene la comunicazione del server con il mondo esterno.
In ingresso riceve per mezzo della variabile q i caratteri scitti fino a quel momento dell'utente nella casella di input.
In uscita il server scrive utilizzando le sue classiche funzioni di output e l'uscita viene "incanalata" e
stampata dove si traova il codice:
<span id="txtHint"></span>
Ricordate come era fatto il codice di presentazione ?
Ve lo riporto di seguito:
<form>
First Name:
<input type="text" id="txt"
onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
A questo punto conoscendo i canali mediante i quali il server dialoga con l'esterno e avendo un pò di dimestichezza con qualche linguaggio lato
server non sarà difficile gestire l'elaborazione.
Vi propongo di seguito la mia soluzione utilizzando il linguaggio di programmazione php.
<?php
$q=$_GET['q'];
$a = array(
'Anna'
, 'Brittany'
, 'Cinderella'
, 'Diana'
, 'Eva'
, 'Inga'
, 'Johanna'
, 'Diana'
, 'Hege'
, 'Linda'
, 'Kitty'
, 'Ophelia'
, 'Petunia'
, 'Amanda'
, 'Fiona');
if(strLen($q)>0)
{
$hint="";
for ($i = 0; $i < count($a); $i++)
{
$x1=strtoupper(substr($q,0,strlen($q)));
$x2=strtoupper(substr($a[$i],0,strlen($q)));
if($x1==$x2)
{
if($hint=="")
$hint=$a[$i];
else
$hint.=$a[$i];
}
}
if ($hint=="")
echo "no suggestion";
else
echo $hint." ";
}
?>
Spero che siano chiari i meccanismi e i canali per far costruire una applicazione ajax.
Capita la struttura non vi sarà difficile realizzare altre applicazioni che sfruttino la tecnologia ajax.
Link risorse :
Tutorial precedente - Come fare richieste al server
|