Web Design Casacastalda e l’autosuggeritore per i nomi in Ajax

php-developmentIpotizziamo noi di web design Casacastalda di disporre di un form che ha al suo interno una casella di testo con una etichetta che recita: FIRST NAME. Digitando una singola lettera posso farmi aiutare e ricevere suggerimenti du quali possano essere questi nomi? Si usando una particolare funzione che entra in azione non appena il campo cattura la singola lettera in questione, funzione che viene scatenata dall’ evento “onkeyup” richiamata direttamente dal documento stesso:

 

function showHint(str)
{
var xmlhttp;
if (str.length==0)
{
document.getElementById
(“txtHint”).innerHTML=””;
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject
(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById(“txtHint”).innerHTML
=xmlhttp.responseText;
}
}
xmlhttp.open(“GET”,”gethint.asp?q=”+str,true);
xmlhttp.send();
}

Quando il campo str.lenght == 0 é vuoto la funzione non entra in azione altrimenti quando viene digitata la lettera la funziona scatena una serie di eventi tipo creare l’oggetto XMLHTTPRequest , creare una funzione di risposta che tiene conto dell’ esecuzione del codice lato server solo quando la richiesta é stata processata con il famoso stato 4, spedire la richiesta al file php che legge e ritrasmette a ritroso tramite response suggerendo grazie al parametro q il nome in questione da completare che si sta digitando, a questo punto vediamo che cosa ce sta lato server, il famoso PHP che riceve la richiesta e rimanda la risposta:

<?php
// Fill up array with names
$a[]=”Anna”;
$a[]=”Brittany”;
$a[]=”Cinderella”;
$a[]=”Diana”;
$a[]=”Eva”;
$a[]=”Fiona”;
$a[]=”Gunda”;
$a[]=”Hege”;
$a[]=”Inga”;
$a[]=”Johanna”;
$a[]=”Kitty”;
$a[]=”Linda”;
$a[]=”Nina”;
$a[]=”Ophelia”;
$a[]=”Petunia”;
$a[]=”Amanda”;
$a[]=”Raquel”;
$a[]=”Cindy”;
$a[]=”Doris”;
$a[]=”Eve”;
$a[]=”Evita”;
$a[]=”Sunniva”;
$a[]=”Tove”;
$a[]=”Unni”;
$a[]=”Violet”;
$a[]=”Liza”;
$a[]=”Elizabeth”;
$a[]=”Ellen”;
$a[]=”Wenche”;
$a[]=”Vicky”;
//get the q parameter from URL
$q=$_GET[“q”];
//lookup all hints from array if length of q>0
if (strlen($q) > 0)
{
$hint=””;
for($i=0; $i
{
if (strtolower($q)==strtolower
(substr($a[$i],0,strlen($q))))
{
if ($hint==””)
{
$hint=$a[$i];
}
else
{
$hint=$hint.” , “.$a[$i];
}
}
}
}
// Set output to “no suggestion” if no hint were found
// or to the correct values
if ($hint == “”)
{
$response=”no suggestion”;
}
else
{
$response=$hint;
}
//output the response
echo $response;
?>

Annunci

Rispondi

Inserisci i tuoi dati qui sotto o clicca su un'icona per effettuare l'accesso:

Logo WordPress.com

Stai commentando usando il tuo account WordPress.com. Chiudi sessione /  Modifica )

Google photo

Stai commentando usando il tuo account Google. Chiudi sessione /  Modifica )

Foto Twitter

Stai commentando usando il tuo account Twitter. Chiudi sessione /  Modifica )

Foto di Facebook

Stai commentando usando il tuo account Facebook. Chiudi sessione /  Modifica )

Connessione a %s...