Öncelikle merhaba arkadaşlar ..

bir çok arkadaşımızın karşılaştığı sorunlardan biride sayfayı  yenilemeden bilgi transferi veya üye girişi gibi mevzulardır..  🙂

bugün size jquery-ajax ile sayfayı  yenilemeden  veri transferini anlatacağım …

ilk önce  2 tane php dosyası açalım  isimleri İNDEX.php  ve AJAX.php olsun

index .php dosyamıza bir form ekleyelim..  şunu unutmayın formun onsubmit() olayını return false; yapalımki post olmasın yani sayfa yenilenmesin icon smile JQUERY AJAX KULLANIMI(SAYFAYI POST ETMEDEN BİLGİ TRANSFERİ)

 ————————————————————————————————————————————————————–

<form action=”” method=”post”  onsubmit=”return false;”>
<table cellspacing=”0″; cellpadding=”0″;>
<tr>
<td>Kullanıcı Adı </td>
<td><input type=”text” name=”kullanici_adi” /></td>

</tr>
<tr>
<td>Şifre </td>
<td><input type=”password” name=”sifre” /></td>

</tr>
<tr>
<td> </td>
<td><input type=”submit” id=”giris_yap” value=”Giriş yap” /></td>

</tr>
</table>
</form>

ondan sonra şimdide sayfamızın head ilk taglari arasına   önce jquery kutuphanesini ekleyelim şöyle.

 1– // jquery dosyamızıda ekledik

 2– // sayfa yuklendiğinde burası çalışır

3– // giris_yap isimli butona tıkladığında bura çalışır

4–// formdaki tüm elemanların değerini aldık.

5– // giris_yap isimli butona tıkladığımızda gidilecek adres

6–// verinin post ilemi yoksa get ilemi gönderileceği

7–  // post edilecek değer

  8–// eğer ajax işlemi başarılı ise burası çalışır

 9– //dönen değeri cevap isimli değişkene attık

 10–  // ajax dosyamız bulunamazsa burası çalışır

———————–İNDEX.PHP——————————

<!—————————————————————————————————->

<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Başlıksız Belge</title>

<!–1–><script type=”text/javascript” src=”jquery-1.5.2.min.js”></script>

<!————————————————>

<script type=”text/javascript”>

<!–2–>    $(‘document’).ready(function(){

<!–3–>    $(‘input#giris_yap’) .click(function(){

<!–4–>    var deger=$(‘form’).serialize();

                      $.ajax({

 <!–5–>     url=”ajax.php”,

  <!–6–>    type:”POST”,

  <!–7–>     data:deger  ,

<!–8–>    success:function(cevap){

  <!–9–>  alert(cevap) ;

                                  }

                    statusCode:

                                {

<!–10–>       404 :function()

                                 {

                     alert(“sayfa bulunamıyor”);

                                   }

                                   }

                              });

                                   });

                                   });

                            </script>

                               </head>

 ŞİMDİDE ajax.php  dosyamıza gelen verileri alıp  ekrana yazdıralımm..


————————-ajax.php——————————————————-

 <?php

$kullanici_adi=$_POST[‘kullanici_adi’];

$sifre=$_POST[‘sifre’];

echo “Kullanıcı Adımız”.$kullanici_ad.”<br/>  Şifremiz: “.$sifre;

?>

 ——————————————————————————————–

Şimdi index.php dosyamızı çalıştıralım bakalım olmuşmu  🙂

Facebook'dan yorumla