Etiketler: ajaxphp

Javascript Ajax Kullanımı

13/02/2022 -- Engin Beyazgül -- webmaster

      

       Açılımı AJAX(Asynchronous JavaScript And XML) olan, anlık güncellemelere ihtiyaç duyan işlemlerde kullanılan, Javascript programlama dilinin içinde bulunan birkaç sistemin bir araya getirilmesi ile tasarlanmış olan entegredir diyebiliriz. Jquery’ de $.ajax(),$.get(),$.post() olarak gördüğümüz metotlar ve saf Javascript’de de XMLHttpRequest() nesnesi ile AJAX istekleri oluşturmaktayız. AJAX’ ın kullanım alanını bir örnekle açıklamak gerekirse, maç sonuçlarının yayınlandığı bir web sayfasında anlık değişen skorların kullanıcıya sayfa yenilenmeden güncel olarak iletilebilmesi gerekmektedir işte tam burada bu teknolojiyi kullanırız.  

 

Aşağıdaki kod blokları selectbox vasıtası ile seçilen kişinin bilgilerini MySQL veritabanımızdan çekerek sayfa yenilenmeden ekrana bastıran küçük bir örnektir. İlk iki kod bloğumuz istek atan sayfamız son kod bloğumuz ise istek atılan sayfamıza ait olduğunu varsayalım. 

 

     <select name="kisiler" onchange="example(this.value)">
        <option value="1">kisi1</option>
        <option value="2">kisi2</option>
    </select>
    <div id="result"></div>
    

 

 function example(data){
        var http = new XMLHttpRequest();
        http.open("POST","kaynak.php",true);
        http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        http.onreadystatechange = function() {
        if(http.readyState == 4 && http.status == 200) {
            document.getElementById('result').innerHTML = http.responseText;
        }
        else{
            document.getElementsByClassName('result').innerHTML = "hata";
        }
        }
        http.send("data="+data);
    }

 

 $sorgu = $baglan->query("SELECT * FROM kisiler WHERE id = '{$gelen}'")->fetch(PDO::FETCH_ASSOC);
    echo 'id: '.$sorgu["id"].'
'. 'ad soyad: '.$sorgu["name"].'
'. 'yaş: '.$sorgu["age"].'
'. 'ülke: '.$sorgu["country"].'
';

 

       Örnek şu şekilde işlemektedir; seçilen veri değiştirildiği anda çalışacak bir fonksiyon belirtiyoruz ve seçilen verinin value değerini de fonksiyonumuza parametre olarak atıyoruz. XMLHttpRequest() nesnesi ile bir AJAX isteği başlatıyoruz. Veri gönderim metodunu, gönderilecek adresi, async(true-false) durumunu ve beraberinde fonksiyon parametremizi gönderiyoruz ve diğer sayfamızdan gelen dönütü ekranımıza basıyoruz. Php ve Sql kısımlarını koymadığım örneğin tamamına buradan ulaşabilirsiniz. Sağlıcakla... 

Kategoriler

Sosyal

Sitede ara

İstatistikler

enginbeyazgul.com

800

gündür yayında.

9

adet yazı mevcut.