Konuyu Goruntule: AJAX Nedir? Nasıl Kullanılır?

Sushke
17.07.2012, 11:28
Ajax aslında bir javascript kodudur. Ajax Javascript ve XML ActiveX Objesi aracılığı ile sayfanın yeniden yüklenmeden sadece belirli kısımlarının değişmesini sağlayan kod sistemidir. Günümüzde birçok web uygulaması bu platform ile çalışmakta, interaktif olarak daha görsel bir hizmet vermektedir. Örnek vermek gerekirse; Google Inc. , Facebook vb..

Peki bu AJAX nasıl kullanılır? Çok basittir. Aşağıdaki örneği kısaca anlatayım.
look.php adında bir sayfamız var ve işlevi gönderilen karakterler ile başlayan dosya isimlerini döndürüyor. (i karakterini gönderdiğimizde "index.php", "inc.php", "include.php" gibi i harfi ile başlayan sunucumuzdaki dosyaları listeliyor) Birde asıl kodumuzun çalıştığı sayfamız var ("x.php" olsun). Bu Sayfanın kodları aşağıdadır. Sayfa adı kısmına mesela "i" yazdık ve google daki gibi otomatik tamamlama çıktı. bize bir liste sundu (i harfi ile başlayan dosyalar).

<form>
SayfaAdı: <input type="text" id="txt1" onkeyup="onLoadPage(this.value)" />
</form>
<p>Sonuç: <span id="sonuc"></span></p>
<script type=”text/javascript”>
var xmlhttp

function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari için
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// IE6, IE5 için
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}

function onLoadPage(str)
{
if (str.length==0)
{
document.getElementById("sonuc").innerHTML="";
return;
}
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Tarayıcınız XMLHTTP desteklemiyor!");
return;
}
var url="look.php";
url=url+"?p="+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("sonuc").innerHTML=xmlhttp.responseText;
}
}
</script>

Alıntı.

alenn34
16.06.2013, 15:47
teşekkürler güzel paylaşım