Şimdi size PHPLiveX ve DOM ile nasıl bir formu kontrol edeceğimizi anlatacağım.
PHPLiveX sınıfını PHPLiveX - An Open Source PHP / AJAX Library And Framework indirebilirsiniz.
Bu üstteki formda öncekinde fakrlı olarak input ve textarea lar için "id" argümanını ekledim. Ayrıca formu gönderen butonu submit değil de button olarak işaretledim.
Şimdi bu noktada yapmamız gereken 4 şey var:
1 - fonksyonları içeren bir php dosyası hazırlamak (fonksyonlar.php gibi)
2 - bir javascript kodu oluşturmak (Dom ile verileri alabilmek için)
3 - PHPLiveX sınıfını kullanabilmek için sayfaya yüklemek
4 - Bir adet "loader" animasyonu koymak
1. Adımdan başlayalım
function kontrolEt($ad,$soyad,$eposta,$yorum){
if(!empty($ad) && !empty($soyad) && !empty($yorum) && preg_match("/^( [a-zA-Z0-9] )+( [a-zA-Z0-9\._-] )*@( [a-zA-Z0-9_-] )+( [a-zA-Z0-9\._-] +)+$/" , $eposta) ){
return true;
}else{
return false;
}
}
Bu üstteki dosyayı herhangi bir isim ile kaydedebilirsiniz. Ben "fonskyonlar.php" olarak kaydettiğinizi varsayacağım.
2. Adım
Javascript fonksyonu için 2 seçeneğimiz var:
a) arasına ********** tagı içerisinde fonksyonu yazmak
b) harici bir .js dosyasında fonksyonu barındırmak.
Her iki şekilde de fonksyonumuzun yapısı değişmeyeceğinden bu kısım size kalmış. Eğer fonksyonları sakladığınız bir js dosyanız var ise burada vereceğim fonksyonu js dosyasına entegre edebilirsiniz. Diğer durumda ise fonksyonun başına:
<script>sonuna ise:
</script>koymanız gerekmekte..
Javascript fonksyonumuz ise şu şekilde
function formKontrol(){
var ad = document.getElementById('ad').value;
var soyad = document.getElementById('soyad').value;
var eposta = document.getElementById('eposta').value;
var yorum = document.getElementById('yorum').value;
if(kontrolEt(ad,soyad,eposta,yorum, {'preloader':'pr'})){
document.yorumFrm.submit();
}else{
alert('Eksik yada yanlış bilgi girdiniz. Lütfen formu kontrol edin.');
}
}yukarıda ki kodda, Dom ile inputların değerlerini aldık. dikkat ederseniz kontrolEt bizim php fonksyonumuzun adı. Buradan da php fonksyonuna veri gönderiyoruz. Normal koşullar altında bunun imkanı yok. Tabii PHPLiveX sağolsun, artık bu şekilde çalışabiliyoruz. PHP fonksyonundan gelen veri "true" yani doğru/geçerli ise formu gönderiyor, değilse hata mesajı veriyoruz.
3. PHPLiveX 'in yüklenmesi ve yapılandırma:
PHPLiveX i sayfamızın en üstünde "require('PHPLiveX.php');" şeklinde içeriye alıyoruz.
ondan sonra tagları arasında, mümkünse headın sonuna şu kodları ekliyoruz:
$ajax = new PHPLiveX(array('kontrolEt'));
$ajax->Run();
?> dikkat ederseniz burada kontrolEt fonksyonunu işaret ettik. Böylelikle PHPLiveX fonksyonlar.php dosyasında ki (daha önceden require ile içeri almayı unutmayın) kontrolEt fonksyonunu kullanması gerektiğini anladı.
4. loader:
dikkat ederseniz verdiğim javascript kodunda "preloader" diye bir argüman var. Bu argüman, fonksyonlar çalışırken hangi kısmın "yükleniyor" animasyonu olacağını belirtiyor. Animasyon dediğime bakmayın, bu herhangi bir yazı yada resim olabilir
örnek:
YükleniyorBöylelikle 4 adımda PHPLiveX ile form gönderilmeden önce kontrollerimizi yapmış olduk. Bundan sonrası ziyaretçi defteri ile alakadar konu ile aynı. Veritabanına veri girilmesi vb.
Herhangi bir sorunuz olursa konuya cevap yazabilirsiniz. Kodları test etmediğimi tekrar belirtmek isterim. Daha fazla örnek ve açıklamalar için PHPLiveX sitesini ziyaret edebilirsiniz. PHPLivex i kullandığım başka tip fonksyonlar yazarsam yine eklemeye çalışırım.
Herkese iyi çalışmalar..
