AJAX ile Eş Zamanlı Form Kontrolü
Kısaca konuyu anlatmak
gerekirse eski usulde form kontrolünde tüm formu doldururdunuz ve
bittiği zaman "Gönder" düğmesine basardınız. Eğer girmiş olduğunuz
kullanıcı adı veya e-posta adresi başkası tarafından kullanılıyorsa
ancak tüm formu doldurup gönderdikten sonra bunu öğrenebilirdiniz.
Oysa ki AJAX ile o an doldurmuş olduğunuz metin kutusunu eş zamanlı
olarak kontrol edilmesini sağlama imkanınız var. Yani kontrolü,
gönder butonuna basmadan önce, form elemanı doldurulduğu anda
yapabileceğinizi kastediyorum. Konuyu anlatırken AJAX-TR için
hazırladığım ve AJAX Tab Kontrol ismini verdiğim örnek uygulamayı
kullanacağım. İsmine "Tab kontrol" dedim çünkü Tab tuşuna basıldığı
anda veya kutudan çıkıldığı anda kontrolün yapılışını anlatacağım.
Dosyalar
Uygulamada ana sayfayı oluşturan index.php dosyası, kontrolün
yapıldığı ve bilginin gönderildiği kontrol.php dosyası ile eyceks
kütüphanesinin dosyaları (loading.gif, eyceks.js) bulunmakta.
İlk Adım
Kontrol edeceğimiz formu index.php dosyasında oluşturuyoruz.
Sadece bir metin kutusu bize yetecektir. Yanına da yeşillik niyetine
parola kutusu koydum
PLAIN TEXTHTML:
<form action="void(0)" method="POST"
name="form1">
<table>
<tr><td colspan="2"><b>ÜYE GİRİŞİ</b><br><br></td></tr>
<tr><td width="100">Kullanıcı Adı</td><td width="350">: </td></tr>
<tr><td>Parola</td><td>: </td></tr>
<tr><td></td><td></td></tr>
</table>
</form>
Dikkat ederseniz kullanıcı adı metin kutusunun onblur olayına
kontrol_et() işlemini yapmasını belirttim. Bu kontrol_et()
fonksiyonu form bilgisini kontrol.php dosyasına gönderecek olan
fonksiyon. Aşağıda bu fonksiyonu açıklayacağım.
Formumuzu hazırladık diyelim. Bizim burada yapacağımız şey kontrol
butonuna basılmadan kullanıcı adının girildiği kutuyu, biz parola
hanesine geçerken kontrol edilmesini sağlamak. Kontrolde, girilen
kullanıcı isminin var olup olmadığına bakılmasını ve kullanıcıyı
buna göre uyarmasını istiyoruz.
İkinci Adım
AJAX Tab Kontrol'de bu sitenin yazarı eburhan'ın arkadaşımızın
eyceks kütüphanesini kullandım.
Bu ikinci aşamada eyceks'i form kontolü yapacağımız index.php
dosyasına çağıralım.
PLAIN TEXTJAVASCRIPT:
[/javascript]
Bu işlemi de tamamladıktan sonra sıra geldi <strong>Tab</strong>
tuşuna bastığımızda işlemesi gereken javascript fonksiyonuna.
<h3>Üçüncü Adım</h3>
[javascript]function kontrol_et(){
var sc = 'uyeadi='+ document.form1.kullanici_adi.value;
JXP(1, "sonuc", "kontrol.php", sc);
}
İşte bu kodlarla tabtuşuna basılıp parola kutusuna geçerken eyceks
kutuphanesini de kullanarak kontrol.php dosyasına kullanıcı adını
POST metoduyla (JXP) yolladık. Gelecek olan cevabı da "sonuc"
id'sine sahip elemanda görünecek şekilde ayarladık.
Son Adım
Son adım ise kontol.php dosyasını oluşturduğumuz kısım. Bu
dosyada kontrolü dilediğiniz gibi ayarlayabilirsiniz. İster
veritabanına bağlantı kurun, isterseniz de bir e-posta adresinin
uygun yazılıp yazılmadığını kontrol edin. Burası size kalmış. Ben
ise sadece 5 tane üye ismi belirledim ve girilen ismin bunlardan
birisiyle aynı olup olmadığını kontrol ediyorum. Ne de olsa önemli
olan mantığı kavramak
kontol.php
PLAIN TEXTPHP:
isim zaten mevcut :-(</font>';
break;
case "":
echo '<font>isim girmediniz!</font>';
break;
default:
echo '<font color="blue">isim uygun :-)</font>';
}
?>
Sonuç
Umarım konuyu yeterince açık bir şekilde anlatabilmişimdir
Anket
Son Konular
2012-03-22 19:47 - Geliştirdiğin kodları satmak ister misin
2012-02-12 23:21 - SMF forumu vbulletin foruma aktarmak
2011-12-14 21:50 - Motorlu araçlar otomobil vergisi sorgulama
2011-12-14 21:47 - Sorgulamalar
2011-12-11 14:33 - Ben az önce ne arayacaktım
2011-09-10 22:51 - DSLR Fotograf Makinası sınıflandırması
2011-09-09 17:33 - ‘Crop Factor’ Nedir, hakkında bilgi
2011-09-09 17:30 - Fotograf Rehberi
2011-08-20 21:30 - Samsung LEDTV'lerde .SRF ve XFS süprizi
2011-08-19 00:45 - 2011 yılının web tasarım trendleri
2011-04-09 20:18 - Alan adları gerçek isim sahiplerine verilecek!
2011-01-13 01:43 - SEO İçin Dikkat Edilmesi Gereken Hususlar
2011-01-13 01:42 - Meta tag SEO Optimization
2011-01-13 01:41 - Google Adsense Hakkında Detaylı Bilgi
2011-01-13 01:40 - Soru Ve Cevaplar ile Google Adsense
2011-01-13 01:39 - Arama motoru Google ve Pagerank
2011-01-13 01:38 - Seo Sözlüğü
2011-01-13 01:37 - Google Arama Özellikleri
2011-01-13 01:36 - Adsense Reklam Yerleşimi
2011-01-13 01:35 - Robots.txt Dosyası Kullanım Robotları Yölendirme Kontrol
2011-01-13 01:34 - Sitenizin Google ve Web deki Yeri
2011-01-13 01:33 - Arama Motoru Bilgi ve İpuçları
2011-01-13 01:31 - Arama Motorları Teknikleri
2011-01-13 01:29 - Google Pagerank Detaylı Anlatım
2011-01-13 01:27 - Sitenize Ziyaretçiler En Çok Hangi Kelimeler İle Gelmiş
2011-01-13 01:25 - Pagerank Nedir?
2011-01-13 01:19 - Fireworks Shadow and Glow
2011-01-13 01:18 - Fireworks Sharpen
2011-01-13 01:16 - Fireworks Other
2011-01-13 01:13 - Fireworks Blur
2011-01-13 01:09 - Fireworks Bevel and Emboss
2011-01-13 01:05 - Fireworks Adjust Color
2011-01-13 01:03 - Fireworks Save as Style
2011-01-13 00:58 - Fireworks Text Menüsü
2011-01-13 00:54 - Fireworks Select Menüsü
2011-01-13 00:54 - Fireworks Modify Menüsü
2011-01-13 00:51 - Fireworks View Menüsü
2011-01-13 00:18 - Fireworks Edit Menüsü
2011-01-13 00:16 - Fireworks File Menüsü
2011-01-13 00:05 - İnternet - Web Tarayıcılar (Browser)
2011-01-13 00:04 - İnternet - Web Server Yazılımları
2011-01-13 00:03 - İnternet ve Web İlişkisi
2011-01-13 00:02 - İnternette Kullanılan Protokoller
2011-01-13 00:01 - İnternet - World Wide Web (WWW) Nedir?
2011-01-13 00:00 - İnternet - URL nedir?
2011-01-12 23:43 - İnternet Backorder Nedir?
2011-01-12 23:34 - İnternet - Virüs Nedir?
2011-01-12 23:32 - İnternet Paypal nedir? Nasıl Kullanılır?
2011-01-12 23:31 - İnternet - DNS Nedir?
Günün Konuları
c# . javascript . C . xmlhttprequest . xml . xmlhttprequest nedir . c# ile yazma . c# kod çalıştırma . while . c# kodları . integer . c# string . c# tipler . value . type . reference type . console . const . decimal . boolean . writelene . printf . include . scanf . ajax nedir . http . http istemleri . ajax örneği . ajax tarayıcı desteği . activexobject . ajax ile sunucuya istek göndermek . null . showhint . getxmlhttpobject . statechanged . ajax php örneği . ajax asp örneği . ajax html sayfası . c# doğuşu . c# programlama sanatı . c# atama işlemleri . c# kuralları . c# türlerin tanımlanması . int . programlama . c# program kodları . c# döngü . c# ile ekrana yazı yazdırmak . c# aritmetik . c# operatörler . c# int . casting . byte . c# console . c# konsoldan veri girişi . static void main . c# decimal veri tipi . c# kayar nokta verileri . IEEE . c# yazı biçimlendirme . currency . general . c# char . compareTo . equals . c# while döngüsü . c# for döngüsü . c# foreach döngüsü . döngüler . hata yakalama . catch . pperatörler . .net framework . delphi . c++ builder . write . c# deki string dönüşümler . C nedir . C fonkisyonlar . getch .














Yeni yorum gönder