Jquery, ajax ve thread üzerine…

Sayfayı yenilemeden başka sayfalardan veri çekerek göstermek istiyorsanız Jquery kütüphanesinin ajax fonksiyonunu kullanabilirsiniz. İlk önce fonksiyonun standart kullanımını anlatalım. Sonra fonksiyonu ileri düzeyde inceleyelim.

$.ajax({
  type:'POST',//Veri gönderme methodu
  url:'http://www.sunucu.com/Kontrol/',//veri gönderilecek sayfa
  data:'email='+email,//veri
  success:function(e)
  {
    alert(e);//Gelen sonucu e değişkeninde tut ve göster
  }
  });

Şimdi gerçek bir uygulama yapalım. Örneğin bir yönetici ekleme sayfasında olduğumuzu düşünelim kullanıcıdan adını, soyadını ve mail bilgilerini forma girmesini istedik. Kullanıcının girdiği mail adresini daha önceden girmiş başka bir kullanıcı olabilir bunu engellemek için ajax’ı kullanabilirim. Ajax fonksiyonu kullanıcının girdiği mail bilgisini okuyacak sonra başka bir sayfaya mail adresini gönderecek. O başka sayfada mail adresini kontrol edip var yada yok diye cevap verecek. Sonuç olarak gelen cevaba göre yönetici eklenecek yada hatalı mail adresi denilecek. (Var yada yok diye cevap verecek sayfanın düzgün çalıştığını varsayıyorum.)

<form onSubmit=”return yoneticiKontrol();” …

function yoneticiKontrol()
{
  var email = $('#email').attr('value');

  $.ajax({
    type:'POST',
    url:'http://www.sunucu.com/Kontrol/',
    data:'email='+email,
    success:function(e)
    {
      if(e == 'yok')
        return true;//Mail adresi geçerli. Form gönderilsin
      else if(e == 'var')
        alert("Mail adresi kullanılıyor!");
      else
        alert("Hata Oluştu");
    }
  });

  return false;//Mail geçersiz yada hata oluştuysa form gönderilmesin
}

İlk bakışta sorunsuz görünsede bu fonksiyon hatalı çalışır. Çünkü siz ajax fonksiyonunu çağırdığınızda bu fonksiyon sizin için yeni bir thread yaratır ve istediğiniz işlemleri buna yaptırır. Bu yeni thread yeni bir süreç oluşturur. Bu süreç yoneticiKontrol() fonksiyonundan sonra bitebilir. Çoğu zamanda böyle olur. Yani 20. satır 12. satırdan  daha önce işlenir. Fonksiyon her zaman false değeri döndürecektir. Kullanıcı doğru bir mail adresi girse bile form gönderilmeyecektir.

Bunu şu şekilde çözebiliriz.  Önce global bir değişken oluşturalım adı yKontrol olsun bunun ilk değerini false verelim. Biz eğer kullanıcının maili geçerli ise yKontrol değişkenine true verelim ve ana fonksiyonu (yonetici Kontrol fonksiyonunu) tekrar tetikletelim. Fonksiyon çalışınca önce yKontrol değişkenine baksın eğer false ise normal çalışmasına devam etsin; true ise fonksiyon daha önce çalışmış ve maili geçerli bulmuş demektir formu göndersin.

var yKontrol = false;
function yoneticiKontrol()
{
	if(yKontrol == true)
		return true;

	var email = $('#email').attr('value');

	$.ajax({
		type:'POST',
		url:'http://www.sunucu.com/Kontrol/',
		data:'email='+email,
		success:function(e)
		{
			if(e == 0)
			{
				yKontrol = true;
				$('#yonetici_form').submit();//Bu fonksiyonu tekrar çalıştırır
			}
			else if(e == 2)
				alert("Mail adresi kullanılıyor!");
			else if(e == 1)
				alert("Kullanıcı adı kullanılıyor");
		}
		});

	return false;
}