Turning gears are the logo of co-scripts

Ajax web sayfalarında sunucudan veri çekebilmek için kullandığımız, temelde tek bir objeye dayalı bir teknik. Ancak ajaxtan daha orjinal olan her versiyonda yetenekleri artan javascript. Uygulamalardaki taleplerimiz arttıkça daha derin javascript bilgisine ihtiyaç duyuyoruz. 

Bu yazıda ajax kullanarak closure ile veri çekme ve ilgili fonksiyona devretme üzerine bir örnek vereceğim. Web uygulamamızda bir tetikleyici bir fonksiyonu çağırır ve herşey başlar.Örneğimizde: yeniSiteEkle() fonksiyonu çağrılıyor. Örnekteki parametreler kendilerini açıklıyorlar.

function goster(gelenVeri){alert(gelenVeri.cevapMetin);}

function yeniSiteEkle()
{
var listeTasiyici = nY('listetasiyiciSpan');
var url = 'jobs.asp?job=test';
var target = 'durum';
ajax_job(url,target,imgJob,goster);
}

Tabi daha önce yazılan ajax içeren fonksiyonda şu şekilde:

function ajax_job(sorgulanacakUrl,geciciMesajHedefNesnesi,geciciMesaj,isleyiciFonksiyon)
{
	var gM = document.getElementById(geciciMesajHedefNesnesi);
    gM.innerHTML = geciciMesaj;
    // doğal XMLHttpRequest nesnesi kontrolü, yoksa Activex (windows) üzerinden gidilecek
    if (window.XMLHttpRequest){req = new XMLHttpRequest();}else if(window.ActiveXObject){req = new ActiveXObject("Microsoft.XMLHTTP");}
        if (req)
			{
            req.onreadystatechange = function(){var dondurulenler = evetOldu(); isleyiciFonksiyon(dondurulenler); gM.innerHTML='' }
            req.open("GET", sorgulanacakUrl, true);
            req.send();
			}
 }    

function evetOldu() {
	var durumKod,durumMetin,cevapMetin;
    // Eğer req yüklendiyse
    if (req.readyState == 4) {
        // req durumu "OK" ise kodu 200
        if (req.status == 200) {
			return {durumKod:req.status, durumMetin: req.statusText, cevapMetin:req.responseText}
        } else {
			return {durumKod:req.status, durumMetin: req.statusText, cevapMetin:req.responseText}
        }
    }
}

Burada ajax gerekli requesti yaptıktan sonra dönen veriyi kendi fonksiyonuna bir parametre olarak gelen fonksiyona parametre olarak veriyor. Bunu yaparken veriyi hazırlayan fonksiyon değişkenleri fonksiyon adından üretilecek bir değişkenin (nesnenin) özellikleri olarak gönderiliyor.

Geriye sadece çağrılan fonksiyonda bu özellikleri kullanmak kalıyor. Closure, method, callback gibi kavramları daha basit örneklerle daha sonra anlatırız, ancak bu örnek ajax ile çağıran fonksiyonlar arasında geri dönük bir bağ kurarak kontrolleri ajax çağrısı yapan fonksiyonun içinde yapmaktan bizi kurtarıyor, böylece farklı uygulamalarda sadece çağrı yapıp sonucu döndüren bu fonksiyonu tekrar tekrar kullanabiliriz. Sunucu isteği sırasında işlemin yapıldığına dair hedef taşıyıcı (span yada div vb.) içine gönderilen img tagıda çağrı bittiğinde kaldırılıyor. Böylece sonuç ve işlem yapılıyor imgeleri farklı yerlere koyulabiliyor. Closure ve callback en sıkı jquery tarafından kullanılıyor.

co-scripts tag image ajaxcallbackclosuremethodactivexobjectxmlhttprequest
ID:202 | Okunma:1735