Form Alanına Yalnızca Sayısal Değer Girişi Sağlama

Nisan 23 01:29 2014 Yazar: A.Gökhan, M.Sc. Bu yazıyı yazdır

Geliştirdiğimiz web projelerinde form alanlarını sıklıkla kullanırız. Bu alanlar her zaman standart bir şekilde veri girişi için kullanılmaz. Örneğin üyelik kaydı yapılacak bir form alanında kullanıcıdan e-mail adresi girmesini istediğimiz alana e-mail doğrulama özelliği ekleriz. Kredi kartı bilgilerini girdiği alana ise yalnızca sayısal veri girmesi bir ön kontrol ve filtreleme gibi iş görecektir. Üye olan bir kullanıcının şifre bilgilerini type=”password” olan bir textfield, diğer bir deyişle metin alanı içerisinde alabilmeyi isteriz.

Buradan hareketle bu bölümde, içerisine yalnızca sayısal veri girişi olmasını istediğimiz ve bu amaçla ön kontrol yapacağımız bir JavaScript kodu yazacağız. Öncelikle form alanını oluşturalım:

<input name="" type="text" onChange="isNumeric(this)" />

1	<input name="" type="text" onChange="isNumeric(this)" />

Yukarıda gördüğümüz HTML kodları, bir metin alanını ifade etmektedir. onChange özelliğine isNumeric fonksiyonunu, parametre olarak da HTML elementin kendisini işaret ettik. Form alanına veri girilip mouse ile başka bir bölgeye geçiş sağlanması, isNumeric fonksiyonunu tetikleyecektir:

function isNumeric(v) {
	var isNum = /^[0-9-'.']*$/;
	if (!isNum.test(v.value)) {
		alert('Sadece Sayı Giriniz!');
		v.value = v.value.replace(/[^0-9-'.']/g,"");
	}
}