AJAX Öneri Kaynak Kodu

< Önceki Sonraki >

AJAX Öneri Örneğinin Kaynak Kodu

Aşağıdaki kaynak kodlar önceki sayfadaki AJAX örneğine aittir.

Kodları kopyalayıp siz de deneyebilirsiniz.


AJAX HTML Sayfası

Bu HTML sayfasıdır. Bu sayfa basit bir HTML formu ve bir JavaScript koduna bağlantı içerir.

<html>
<head>
<script src="clienthint.js"></script> 
</head>
<body>
<form> 
First Name:
<input type="text" id="txt1"
onkeyup="showHint(this.value)">

</form>
<p>Öneriler: <span id="txtHint"></span></p> 
</body>
</html>

JavaScript kodu aşağıda gösterilmektedir.


AJAX JavaScript

Bu, "clienthint.js" dosyasındaki JavaScript kodudur:

var xmlHttp

function showHint(str)
{
if (str.length==0)
  { 
  document.getElementById("txtHint").innerHTML="";
  return;
  }
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
  {
  alert ("Your browser does not support AJAX!");
  return;
  } 
var url="gethint.asp";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
} 

function stateChanged() 
{ 
if (xmlHttp.readyState==4)
{ 
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
  {
  // Firefox, Opera 8.0+, Safari
  xmlHttp=new XMLHttpRequest();
  }
catch (e)
  {
  // Internet Explorer
  try
    {
    xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
    }
  catch (e)
    {
    xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
return xmlHttp;
}


AJAX Sunucu Sayfası - ASP ve PHP

Ajax sunucusu olarak bir kısıtlama yoktur. AJAX sayfaları herhangi bir internet sunucusu tarafından sunulabilir.

Önceki bölümdeki örnekte JavaScript kodu tarafından çağrılan sunucu sayfası "gethint.asp" adında basit bir ASP dosyasıdır.

Aşağıda biri ASP diğeri PHP ile yazılmış iki sunucu sayfası kodu örneği verilmiştir.


AJAX ASP Örneği

"gethint.asp" sayfasındaki kod bir Internet Information Server (IIS) sunucusu için VBScript 'de yazılmıştır. Bu sayfa bir isim dizisini kontrol edip uygun olanları istemciye döndürmektedir:

<%
response.expires=-1
dim a(30)
'Fill up array with names
a(1)="Anna"
a(2)="Brittany"
a(3)="Cinderella"
a(4)="Diana"
a(5)="Eva"
a(6)="Fiona"
a(7)="Gunda"
a(8)="Hege"
a(9)="Inga"
a(10)="Johanna"
a(11)="Kitty"
a(12)="Linda"
a(13)="Nina"
a(14)="Ophelia"
a(15)="Petunia"
a(16)="Amanda"
a(17)="Raquel"
a(18)="Cindy"
a(19)="Doris"
a(20)="Eve"
a(21)="Evita"
a(22)="Sunniva"
a(23)="Tove"
a(24)="Unni"
a(25)="Violet"
a(26)="Liza"
a(27)="Elizabeth"
a(28)="Ellen"
a(29)="Wenche"
a(30)="Vicky"
'get the q parameter from URL
q=ucase(request.querystring("q"))
'lookup all hints from array if length of q>0
if len(q)>0 then
  hint=""
  for i=1 to 30
    if q=ucase(mid(a(i),1,len(q))) then
      if hint="" then
        hint=a(i)
      else
        hint=hint & " , " & a(i)
      end if
    end if
  next
end if
'Output "no suggestion" if no hint were found
'or output the correct values
if hint="" then 
  response.write("no suggestion")
else
  response.write(hint)
end if
%>


AJAX PHP Örneği

Yukarıdaki kodun PHP ile yazılmış hali:

Not: Örneği PHP ile çalıştırmak için, "clienthint.js" dosyasındaki url değişkeninin değerini "gethint.asp" den "gethint.php" ye değiştirmeyi unutmayın.

PHP Örneği

<?php
header("Cache-Control: no-cache, must-revalidate");

 // Date in the past
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");

// 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<count($a); $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;
?>

< Önceki Sonraki >
ajax, learn ajax, ajax nedir, ajax örneği, ajax örnekleri, ajax dersleri, ajax tutorial, ajax programlama, ajax nasıl, ajax kodları, ajax lessons, ajax öğren, ajax dersi, ajax how to,