Macamana Nak Lock Borang Hanya Nombor Sahaja Dibenarkan

Ada ketikanya kita perlu melakukan control pada borang (user interface) untuk mengelakkan dari pengguna memasukkan data yang salah. Contohnya No. Kad Pengenalan hanya nombor sahaja dibenarkan. Bagi mengelakkan pengguna memasukkan selain dari nombor ada beberapa kaedah boleh digunakan. Kali ini saya tunjuk salah satu dari kedah yang mudah.

DEMO

*Sila taip selain dari nombor di dalam demo di atas.

Javascript

<script type="application/javascript">
  /* only allow number */
  function isnumeric(evt)
      {
         var CharacterCode = (evt.which) ? evt.which : event.keyCode
         if (CharacterCode > 31 && (CharacterCode < 48 || CharacterCode > 57)  && CharacterCode != 46 )
            return false;

         return true;
      }


</script>

Contoh Borang

<form id="form1" name="form1" method="post" action="">
  <table width="400" border="0" cellspacing="2" cellpadding="2">
    <tr>
      <td>Nama</td>
      <td><input name="nama" type="text" id="nama" size="40" /></td>
    </tr>
    <tr>
      <td>Kad Pengenalan</td>
      <td><input type="text" name="kp" id="kp"  onKeyPress="return isnumeric(event)"/></td>
    </tr>
    <tr>
      <td>Tel Bimbit</td>
      <td><input type="text" name="hp" id="hp"  onKeyPress="return isnumeric(event)"/></td>
    </tr>
  </table>
</form>

Selamat Mencuba!