Adobe firması Ajax kullanımını arttırmak için Spry adıyla bir framework yayınlamıştı. Bende yıllardır, severek Dreamweaver kullanan biri olarak, bu konu üzerine bir hayli eğilmiştim. Dreamweaver kendi bünyesinde Spry ile basit ama çık, Ajax tasarımları yapmayı sağlıyor. Ama siz üzerine biraz düşerseniz, oldukça profesyonel işler çıkıyor ortaya.
Tüm bunlara rağmen nedendir bilemiyorum. Bu gibi artıları Spry’ın kullanımını ülkemizde pek ilerletmedi. İlk başladığımda herhangi bir türkçe kaynak bulamamıştım. O zamanlar ingilizce kaynaklar üzerinden çoğu şeyi öğrenmiştim. Tabi orda da birinci kaynağım, Adobe’ın Spry’a ait dökümanları olmuştu. Dün akşam bu konu tekrar aklıma geldi, bir arama yaptım. Gene ortalarda dişe dokunur bir türkçe kaynak yok.
Bu sabah itibariyle bende bir karar verdim. Daha önce “Spry ile Doldurulması Zorunlu Formlar Yapmak” adlı bir ders yayınlamıştım. Bu dersin devamını getirmek benim Dreamweaver’a borcum oldu. Önümüzdeki günlerde Spry ile ilgili türkçe kaynak sonunu temel olacak ölçüde çözmeyi hedefliyorum. Umarım Ajax ve Dreamweaver severlerin ilgisini çeker.
Bir uygulama yaptığınızı düşünün, ekranda sadece bir textbox ve buton var. Uygulamayı kullanan kişi o gün işe geç kalanların TC Kimlik Numaralarını ilgili alana yazıp, "Kaydet" butonuna basarak sisteme kaydediyor.
Textbox'a sadece rakamlar girilmesi gereken böyle basit bir sistemde, araya yanlışlıkla yazılan bir harf kullanıcının canını sıkabilir. Bugün bunu nasıl engelleyeceğimizi öğreneceğiz. (Örnek Dosyayı İndir)
1- İşimizi görecek dosya aşağıda bunu "numeric.js" ismiyle kaydedelim.
JavaScript:
-
function ForceNumbersOnly(myfield, e, dec){
-
var key;
-
var keychar;</span></span>
-
-
if (window.event){
-
key = window.event.keyCode;
-
}
-
-
else if (e){
-
key = e.which;
-
}
-
-
else{
-
return true;
-
}
-
-
if(key != 46 && key != 45 && key> 31 && (key <48 || key> 57)){
-
return false;
-
}
-
-
else{
-
return true;
-
}
-
}
-
-
function RemoveNonNumeric(myfield){
-
var re = /[^0-9\.\-]/g;
-
-
if(re.test(myfield.value)){
-
myfield.value = myfield.value.replace(re, '');
-
myfield.value = myfield.value.replace(/\./, '');
-
}
-
}
2- Sonrasında bu dosyayı formumuzun bulunduğu ilgili sayfaya yükleyelim.
JavaScript:
-
<script src="numeric.js" type="text/javascript"></script>
3- Harf onaylamasını yapan fonksiyonu etiketinin tam önüne yerleştiriyoruz.
JavaScript:
-
<script type="text/jscript">
-
function ValidateNumber(num){
-
return num.match(/^\d+$/);
-
}
-
</script>
4- Son olarak harf maskelemesi yapacağımız textbox'a aşağıdaki kodları ekliyoruz.
HTML:
-
<input type="text" name="tckimlikno" maxlength="11" onkeypress= "return(ForceNumbersOnly(this, event));" onchange="RemoveNonNumeric(this)"/>