DEMO
Kaynak : http://www.erguner.net/ajax-2/php-aj...sic-suggestion

Arkadaşlar; google, facebook ve youtube gibi dünya’nın en büyük siteleri ajax altyapısı kullanarak kullanıcılarına tavsiye sunuyorlar. Google a bir kelime yazmaya başladığınız andan itibaren her harfte sizin öneriler sunarak doğru sonuca ulaşmanız sağlanıyor. Şimdi bu yapının basit halini bizde örneklerle yapacağız!

Şimdi Öncelikle … html tagları arasına yerleştireceğimiz js scriptimizin kodlarını ekleyelim


<script type="text/javascript">
function showHint(str)
{
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","get.php?q="+str,true);
xmlhttp.send();
}
</script>
Yukarıdaki JS kodlarında IE ve FF uyuşmazlığını ortadan kaldıracak bir kaç özellik yer alıyor. Bunun haricinde bizim için önemli kısım xmlhttp.open komutu. Burada biz hangi dosyadan önerilerimizi alacağız onu görüyoruz. method olarak da GET i seçiyoruz.

<p><b>Bir isim yazmaya başlayın:</b></p>
<form>
Adınız: <input type="text" onkeyup="showHint(this.value)" size="20" />
</form>
<p>Öneriler: <span id="txtHint"></span></p>
</td></tr></table>
Yukarıdaki kodları … tagları arasına yerleştiriyoruz. Burada form alanımız ve önerilerin yazılacağı span la işaretli alan bulunuyor.

Şimdi ise esas meseleye geldik önerileri get.php den alıyoruz demiştik… işte get.php nin kodları

<?php
// İsimleri array olarak listeliyoruz
$a[]="Ahmet";
$a[]="Batıkan";
$a[]="Cihan";
$a[]="Derya";
$a[]="Erman";
$a[]="Fatih";
$a[]="Gizem";
$a[]="Hakan";
$a[]="Işık";
$a[]="Jale";
$a[]="Kemal";
$a[]="Lale";
$a[]="Nazan";
$a[]="Osman";
$a[]="Perihan";
$a[]="Ali";
$a[]="Rasim";
$a[]="Cafer";
$a[]="Doğukan";
$a[]="Erdinç";
$a[]="Ersan";
$a[]="Salim";
$a[]="Tuğra";
$a[]="Uğur";
$a[]="Vahdettin";
$a[]="Leman";
$a[]="Esma";
$a[]="Ergün";
$a[]="Hürtürk";
$a[]="Kamil";
//q parametresini alıyoruz. JS gönderiyor.
$q=$_GET["q"];
//önerileri alıyoruz
if (strlen($q) > 0)
  {  $hint="";
  for($i=0; $i<count($a); $i++)
    {    if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))      {
      if ($hint=="") {  $hint=$a[$i]; }      else        {        $hint=$hint." , ".$a[$i];        }      }    }  }
// eğer önerilecek bişey varsa, önericek,
// yoksa öneri yok diyecek
if ($hint == "")  {  $response="öneri yok";  }
else  {  $response=$hint;  }
//sonuç çıktısı!
echo $response;
?>
Yukarıda Get.php nin kodlarını görüyorsunuz, bununla ilgili anlatım yapmayacağım ancak yorum satırlarında gerekli açıklamaları verdim. array yapısı değiştirilebilir. MySQL den veri çekilip sunulabilir. PHP ve AJAX Suggestion yapısı en basit bu şekilde anlatılabilir herhalde.

DEMO
Kaynak : http://www.erguner.net/ajax-2/php-aj...sic-suggestion