JavaScript ile Form Kontrolü

Bu makalemizde JavaScript ile form kontrolünü öğreneceğiz. Bir metin kutusuna değer girilip girilmediğini, maksimum karakter sayısını istemci tarafında yapacağımız JavaScript kodları ile öğreneceğiz. Twitter'i hatırlayın, maksimum 140 karakter girebilirsiniz,  140 karakterden fazla girmenize izin verilmez. Bu ve benzeri kontroller Jquery ve JavaScript ile yapılır.

Aşağıdaki kullanımı hatırlayınız, web sayfası üzerinde herhangi bir nesnenin ID değerine aşağıda görüldüğü gibi document nesnesinin getElementByID() metodu ile erişebilirsiniz. Bu bir text(metin kutusu), radiobutton(radyo düğmesi), checkbox(onay kutusu), textarea(çok satırlı metin kutusu), tablo hatta bir div bile olabilir. 

adi= document.getElementById("ad").value;

Şimdi aşağıdaki kodları bir editörde yazarak, html uzantılı dosya şeklinde kaydediniz. Html dosyasının üzerine çift tıklayarak çalıştırınız.

<html>
<head>
<meta charset="utf-8">
<script>

function formKontrol()
{
    adi= document.getElementById("ad").value;
   
   if (adi=="")
        alert("Lütfen ad alanını doldurunuz.");
   else
   {
      if (adi.length<3)
           alert("En az 3 karakter giriniz");
      else
          alert("Tebrikler");
   }
}
</script>

</head>
<body>
 
Adınızı giriniz:<input type="text" value="" name="ad" id="ad">
<button type="button" onclick="formKontrol()">Kaydet</button>

</body>
</html>



Mutlu kodlamalar,
Oğuzhan TAŞ
Mayıs, 2015
 
Bookmark and Share