SaintJean
Üye
[BILGI]
İlk olarak veritabanımızı oluşturalım...
Ben WampServer kullanıyorum ve PhpMyAdmin de işlemlerimi gerçekleştiriyorum.Aşağıdaki adımı izleyelim.
Tabiki "Karşılaştırma" kutucuğunda utf8_turkish_ci yi seçmenizde fayda var.(Türkçe karakterleri için.)
Şimdi "Uye" veritabanımızı seçelim ve "SQL" sekmesine girelim. Bu kodları oraya yapıştırın.
"Yapı" Sekmesinde tabloların oluşturulmuş hali bu şekilde olmalıdır.
Tablomuzu da oluşturduk.Şimdi sıra asıl kodlara geldi.
#KayitSayfasi.html oluşturup içine bunları yapıştırıyoruz:
Bu sayfa formumuzun bulunduğu sayfa olacak ve asıl sayfamız budur.
#Ajax.js isimli bir .js dosyası oluşturalım ve içine bu kodları yapıştıralım:
#Php sayfamızın ismi de kayit.php dir.Bu sayfayı oluşturduktan sonra bu kodları yapıştıralım:
Herşey tamam. Şimdi de deneyelim.
[ACIKLAMA]Bu kodları notepad++ programında yazdım. Nereye yazacağım diyen arkadaşlar , programı indirip kurun.
Kayıt sayfası görsel açıdan oldukça fakir. Fakat amaç öğretmek olduğundan fazla görselle uğraşmadım. Umarım beğenip birşeyler öğrenmişsinizdir.[/ACIKLAMA]
Bilindiği üzere kullanıcı web sayfasında veritabanına kayıt yaparken sayfa yenilenmektedir.Bu da görsel olarak pek hoş durmuyor.İşte Ajax bizlere , bu yenilemeyi kaldırıp görsel açıdan daha uygun bir kayıt ekleme olanağı sağlıyor.
[/BILGI]JQuery ile bu işlem gerçekten çok basit. Başlayalım ;
İlk olarak veritabanımızı oluşturalım...
Ben WampServer kullanıyorum ve PhpMyAdmin de işlemlerimi gerçekleştiriyorum.Aşağıdaki adımı izleyelim.
Tabiki "Karşılaştırma" kutucuğunda utf8_turkish_ci yi seçmenizde fayda var.(Türkçe karakterleri için.)
Şimdi "Uye" veritabanımızı seçelim ve "SQL" sekmesine girelim. Bu kodları oraya yapıştırın.
Kod:
-- phpMyAdmin SQL Dump
-- version 3.4.10.1
-- http://www.phpmyadmin.net
--
-- Anamakine: localhost
-- Üretim Zamanı: 28 Haz 2012, 15:09:15
-- Sunucu sürümü: 5.5.20
-- PHP Sürümü: 5.3.10
SET SQL_MODE="NO_AUTO_VALUE_ON_ZERO";
SET time_zone = "+00:00";
/*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */;
/*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */;
/*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */;
/*!40101 SET NAMES utf8 */;
--
-- Veritabanı: `uye`
--
-- --------------------------------------------------------
--
-- Tablo için tablo yapısı `uyeler`
--
CREATE TABLE IF NOT EXISTS `uyeler` (
`Ad` varchar(20) COLLATE utf8_turkish_ci NOT NULL,
`Sifre` varchar(18) COLLATE utf8_turkish_ci NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8 COLLATE=utf8_turkish_ci;
/*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */;
/*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */;
/*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */;Tablomuzu da oluşturduk.Şimdi sıra asıl kodlara geldi.
#KayitSayfasi.html oluşturup içine bunları yapıştırıyoruz:
HTML:
<html><head><title>
..::Kayıt Sayfasına Hoşgeldiniz::..
</title>
<style>
#gonder{width:80px;height:20px;background:red;color;black;cursor:pointer;}
#gonder:hover{background:blue;color;white;}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="Ajax.js"></script>
</head><body>
<div align="center"><form id="ajaxform">
İsim Girin: <input type="textbox" name="isim" /><br>
Şifre Girin:<input type="password" name="sifre" /><br>
<div align="center" id="gonder">Kayit</div>
</form></div>
<div id='sonuc'></div>
</body></html>#Ajax.js isimli bir .js dosyası oluşturalım ve içine bu kodları yapıştıralım:
Kod:
$(function(){
$("#gonder").click(function(){ //Gönder adlı div'e tıklandığında...
$.ajax({ // Ajax başlangıç kodumuz.
type: 'POST', // Gönderme metodumuz.
url: 'kayit.php', // Hangi sayfaya bilgileri taşıyacağız.
data: $('#ajaxform').serialize(), // id si ajaxform olan formun bilgilerini post edilebilecek hale getiren koddur.
success: function(mesaj){ // Ajax başaılı olursa bunları yap...
$("#sonuc").html(mesaj); // id si sonuc olan div'e kayit.php den gelen mesajı yaz.
}});
});
});#Php sayfamızın ismi de kayit.php dir.Bu sayfayı oluşturduktan sonra bu kodları yapıştıralım:
PHP:
<?php
$isim=$_POST['isim'];
$sifre=$_POST['sifre']; // Verilerimizi aldık...
$baglanti=mysql_connect("localhost","root","");
mysql_select_db("uye",$baglanti); // Veritabanı bağlantılarını kurduk...
$kaydet=mysql_query("INSERT INTO `uyeler`(`Ad`, `Sifre`) VALUES ('$isim','$sifre')");//Kaydımızı yapıyoruz.
if($kaydet){
echo "$isim kaydiniz gerceklestirildi.";// Kayıt gerçekleştiyse mesaj
}ELSE{
echo "$isim kaydiniz gerceklestirilemedi."; // Kayıt gerçekleşmediyse mesaj
}
mysql_close($baglanti); // Bağlantıyı kapattık.
?>Herşey tamam. Şimdi de deneyelim.
[ACIKLAMA]Bu kodları notepad++ programında yazdım. Nereye yazacağım diyen arkadaşlar , programı indirip kurun.
Kayıt sayfası görsel açıdan oldukça fakir. Fakat amaç öğretmek olduğundan fazla görselle uğraşmadım. Umarım beğenip birşeyler öğrenmişsinizdir.[/ACIKLAMA]
Son düzenleme:
