Web, işletme ve inovasyon hakkında bir takım yazılar İletişim için Form

Defocuyu takip etmek isteyenlere, RSS - FeedBurnerSanal Alemde Ben, Friendfeed - Flickr - Twitter - Vimeo


Formlarınızı Sadece Sayı Girilebilir Yapmak

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:
  1. function ForceNumbersOnly(myfield, e, dec){
  2.       var key;
  3.       var keychar;</span></span>
  4.  
  5.       if (window.event){
  6.       key = window.event.keyCode;
  7.       }
  8.  
  9.       else if (e){
  10.       key = e.which;
  11.       }
  12.  
  13.       else{
  14.       return true;
  15.       }
  16.  
  17.       if(key != 46 && key != 45 && key> 31 && (key <48 || key> 57)){
  18.       return false;
  19.       }
  20.  
  21.       else{
  22.       return true;
  23.       }
  24.       }
  25.  
  26.       function RemoveNonNumeric(myfield){
  27.       var re = /[^0-9\.\-]/g;
  28.  
  29.       if(re.test(myfield.value)){
  30.       myfield.value = myfield.value.replace(re, '');
  31.       myfield.value = myfield.value.replace(/\./, '');
  32.       }
  33.       }

2- Sonrasında bu dosyayı formumuzun bulunduğu ilgili sayfaya yükleyelim.

JavaScript:
  1. <script src="numeric.js" type="text/javascript"></script>

3- Harf onaylamasını yapan fonksiyonu etiketinin tam önüne yerleştiriyoruz.

JavaScript:
  1. <script type="text/jscript">
  2. function ValidateNumber(num){
  3.         return num.match(/^\d+$/);
  4. }
  5. </script>

4- Son olarak harf maskelemesi yapacağımız textbox'a aşağıdaki kodları ekliyoruz.

HTML:
  1. <input type="text" name="tckimlikno" maxlength="11" onkeypress= "return(ForceNumbersOnly(this, event));" onchange="RemoveNonNumeric(this)"/>

Ekim 22nd, 2008 Etiketler: , , ,
| Kategori: Programlama | Yorum Yap » Yazar: abdullah