Jquery ile Veritabanından Sayfa Yenilenmeden Veri Çekme
Javascript

Jquery ile Veritabanından Sayfa Yenilenmeden Veri Çekme

Merhaba arkadaşlar. Bu makalemizde veritabanından sayfamıza çektiğimiz kayıtları yeni kayıt eklendiğinde, silindiğinde ve güncellendiğinde sayfa yenilenmeden otomatik olarak web sayfamızda göstereceğiz. Örnek olarak Facebook ve Twitter'ı verebiliriz. Bu işlemi php ve jquery yardımı ile yapacağız. Şimdi kodlarımıza geçelim.
index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jquery Veri Çekme</title>
<script src="http://code.jquery.com/jquery-1.9.1.min.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$("#divimiz").load("veriler.php");
});
setInterval(function() {$("#divimiz").load('veriler.php');}, 1000);
</script>
</head>
<body>
<div id="divimiz"></div>
</body>
</html>
Öncelikle index sayfamızı oluşturduk. Jquery kütüphanemizi sayfamıza çektik. Sonrasında sayfa yüklendiğinde işleme alınacak fonksiyonumuzu yazdık. Birazdan oluşturacağımız veriler.php sayfamızı divimiz id'li dive atadık. Setinternal yardımıyla saniyede bir veriler.php sayfamızı divimiz id isimli dive yükledik. Böylelikle verilerde değişiklik yapıldığında veya yeni kayıt eklendiğinde anlık olarak sayfamızda görebileceğiz. 1000 ibaresi yerine 5000 yazarsak her 5 saniyede bu yükleme işlemini yapar. Ardından body etiketlerimiz arasına divimizi yazdık. Şimdi veriler.php sayfamıza geçelim.
veriler.php
include ("baglanti.php");
$ceksql = mysql_query("SELECT * FROM kayitlar order by no desc");
echo '
<table border="0" cellpadding="5" cellspacing="2" width="500">
<tr style="background-color:#ff0000; font-family:Tahoma; color:#ffffff;"><td>Sıra</td><td>Adı</td><td>Soyadı</td><td>Telefon Numarası</td></tr>
';
while($cek = mysql_fetch_array($ceksql))
{
$ad = $cek['ad'];
$soyad = $cek['soyad'];
$tel = $cek['tel'];
$i++;
echo '
<tr><td>'.$i.'</td><td>'.$ad.'</td><td>'.$soyad.'</td><td>'.$tel.'</td></tr>
';
}
echo '</table>';
Bu sayfamızda öncelikle baglanti.php'yi sayfamıza dahil ettik. Bu sayfa veritabanı bağlantımızı sağlayacak. Sql kodumuzu yazıp değişkene aktarıyoruz. Sonrasında while döngüsü ve mysql_fetch_array ile çekip değişkenlere aktardık. Bu değişkenleri de sql kodumuzdan sonra oluşturduğumuz tablo içerisinde yazdırdık. Satır numarası vermek adına döngümüzün içerisinde i değişkenimizi artırıp tablo içerisinde ekrana yazdırdık. Şimdi baglanti.php sayfamıza geçelim.
baglanti.php
$mysql_host="localhost";
$mysql_kullaniciadi="root";
$mysql_sifre="root";
$mysql_vtadi="ajax";
$baglan= @mysql_connect($mysql_host,$mysql_kullaniciadi,$mysql_sifre);
if(! $baglan) die ("Mysql Baglantısında Hata Oluştu!");
mysql_select_db($mysql_vtadi,$baglan) or die ("Veritabanına Bağlanırken Hata Oluştu!");
mysql_query("SET NAMES UTF8");
Veritabanı ile bağlantımızı sağladık. Birde bir veritabanı oluşturmamız gerekiyor. Aşağıda sql kodlarıyla veritabanını oluşturabilirsiniz. Sonraki makalelerde görüşmek dileğiyle...
CREATE TABLE `kayitlar` (
`no` int(11) NOT NULL auto_increment,
`ad` varchar(50) NOT NULL,
`soyad` varchar(50) NOT NULL,
`tel` varchar(11) NOT NULL,
PRIMARY KEY (`no`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8 AUTO_INCREMENT=36 ;


author

Aykut Erdoğan

jquery, php ,javascript, sql, mysql, kayıt, insert

  • Bu Yazılara da Gözat:

    18 Yorum

    author
    author
    author
    author
    author
    author
    author
    author
    author
    author
    author
    author
    author
    author
    author
    author
    author
    author

    Cevapla