Üye Girişi Yapınız     


    E-Posta
    

    Şifreniz
    



Şifremi Unuttum


Ana Sayfa Site Hakkında İletişim Ziyaretçi Defteri Döküman İndir Makale Ekle Haber Ekle

     Php’de JQuery.Ajax() Kullanarak Sayfa Yenilenmeden Form Bilgilerinin Gönderimi
     admin     28.04.2014     11:14:36

Bu paylaşımda Php ve Jquery.Ajax() kullanarak form verilerini formumuzun olduğu sayfamız yeniden yüklenmeden başka bir Php sayfasına göndermenin ve sonuçta uygun bir mesaj yazdırmanın nasıl olacağını anlatmaya çalışacağım. Örneğimizin çalışma mantığı şöyle: 

Bir iletişim formumuz olacak Ad Soyad, E-Posta Adresi, Mesaj Alanlarımız olacak formumuzu doldurup gönder butonuna bastığımızda sayfa yeniden yüklenmeden eğer E-Posta Adresi ve Ad Soyad kısmı dolu ise “Sayın Ad Soyad Mesajınız Gönderilmiştir.“ Ad Soyad yazan yere kullanıcının adı gelecek şekilde bir uyarı, sadece E-Posta Adresi dolu ise “Sayın Ziyaretçi Mesajınız Gönderilmiştir.” şeklinde bir uyarı, E-Posta Adresi boş ise  “Lütfen E-Posta Adresinizi Giriniz” uyarısını verecek.



form.php sayfası
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function(){
    $(’#iletisim’).submit(function(){
        $.ajax({
            type:’POST’,
            url:’kontrol.php’,
            data:$(’#iletisim’).serialize(),
            success:function(data){
if(data == 1){
alert("Lütfen E-Posta Adresinizi Giriniz.");
}else if(data == 2){
alert("Sayın Ziyaretçi Mesajınız Gönderilmiştir.");
}else{
alert("Sayın "+ data +" Mesajınız Gönderilmiştir.");
}
},
            error:function(){alert("Başarısız");}
        });
return false;
    })  
});
</script>
</head>
<body>
<form action="" id="iletisim" method="post" name="iletisim">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td>Adınız Soyadınız</td>
    <td>
    <input name="adsoyad" type="text" />
    </td>
  </tr>
  <tr>
    <td>E-Posta Adresiniz</td>
    <td>
    <input name="eposta" type="text" />
    </td>
  </tr>
  <tr>
    <td>Mesajınız</td>
    <td>
    <textarea name="mesaj" cols="50" rows="5"></textarea>
    </td>
  </tr>
  <tr>
  <td colspan="2">
  <input name="gonder" type="submit" value="Gönder" />
  </td>
  </tr>
</table>
</form>
</body>
</html>
 
Burada yaptığımız işlemleri açıklarsak öncelikle 
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
Satırı ile Ajax ’ı kullanmamıza olanak veren Jquery kütüphanemizi php sayfamıza dahil etmiş olduk.

Ardından formumuzu kontrol.php sayfasına göndermeye ve geri dönen değerlere göre sayfayı tekrar yüklemeden uygun mesajı göstermeyi sağlayan aşağıdaki script ’imizi yazdık.
 
$(document).ready(function(){
    $(’#iletisim’).submit(function(){    //id si iletişim olan formumuzu submit ettiğimizde aşağıdaki fonksiyonu tetikle ve çalıştır.
        $.ajax({
            type:’POST’,   //Formun veri gönderme metodunu yazıyoruz. POST ya da GET olabilir.
            url:’kontrol.php’,   /Formumuzun gönderilip gerekli kontrollerin yapılacağı php sayfasının adresini yazıyoruz.
            data:$(’#iletisim’).serialize(),   //Formumuz serialize() fonksiyonu ile düzenli hale getirilir.
            success:function(data){   //Ajax işlemi başarılı olduğunda yapılacak işlemleri barındıran fonksiyon
if(data == 1){   // Eğer kontrol.php den gönderilen veri 1 ’e eşitse gerekli mesajı ver. 
alert("Lütfen E-Posta Adresinizi Giriniz.");
}else if(data == 2){   // Eğer kontrol.php den gönderilen veri 2 ’ye eşitse gerekli mesajı ver.
alert("Sayın Ziyaretçi Mesajınız Gönderilmiştir.");
}else{   // Eğer kontrol.php den gönderilen veri 1 ve 2 ’ye eşit değilse gerekli mesajı ver.
alert("Sayın "+ data +" Mesajınız Gönderilmiştir.");
}
},
            error:function(){alert("Başarısız");}   // Ajax işlemi başarısız olduğunda yapılacak işlemleri barındıran fonksiyonumuz. Burada Alert ile Başarısız Metnini yazdırdık.
        });
return false;   //Ajax işlemi sonunda sayfanın yenilenmemesi için döndürülmesi gereken false değeri.
    })  
});
 
Geriye kalan tek iş bir adet html form oluşturmak onuda kodumuzun devamında görmüşsünüzdür. Buradaki amaç Php ve Ajax kullanımı olduğu için o kısmı geçiyorum.
 
Form.php ‘de gerekli işlemlerimizi yaptıktan sonra gelelim kontrol.php ‘deki işlemlerimizi yapmaya.
Burada e-posta adresi ve ad soyad değerlerini kontrol ederek geriye gerekli veriyi göndereceğiz. Kontrol.php sayfamızın kodları aşağıdaki gibidir. İnceleyelim ve görelim neler yapmışız.
 
Kontrol.php sayfası
 
<?php
$adsoyad = $_POST[’adsoyad’];   // formumuzu post metoduyla gönderdiğimiz için post ile ad soyadı değişkenimize atıyoruz.
$email = $_POST[’eposta’];    // aynı şekilde eposta adresimizi değişkenimize atıyoruz.
if($email == ""){   //eğer email değişkeni boş ise geriye 1 değerini göndersin
echo 1;
}else{    // eğer email değişkeni dolu ise adsoyad değişkenini kontrol et
if($adsoyad == ""){   // eğer adsoyad değeri boş ise geriye 2 değerini göndersin
echo 2;
}else{    //eğer adsoyad değişkeni dolu ise geriye değişkenin kendisini göndersin sebebi mesajın içinde ad soyadı yazdırmak.
echo $adsoyad;   
}
?>

Facebook'ta Paylaş    
Diğer PHP İçerikleri       Tüm Yazılar        Ana Sayfa


  =>Soru Sorun veya Yorum Yazın...

İsim Giriniz :
  

  =>Yapılan Yorumlar...