JavaScript adalah bahasa pemrograman tingkat tinggi dan dinamis. JavaScript populer di internet dan dapat bekerja di sebagian besar penjelajah web populer seperti Google Chrome, Internet Explorer, Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT.

Hallo sobat, pada tulisan kali ini Saya ingin memberikan tutorial sederhana tentang bagaimana cara membuat sebuah validasi inputan wajib menggunakan Angka. Tahukah kamu? validasi ini sifatnya sangatlah penting, karena untuk menghindari terjadi kesalahan ketik oleh user atau pengguna aplikasi. Jika informasi yang di input user salah, sudah dipastikan data yang di simpan ke dalam aplikasi tidak valid.

Data inputan yang harus menerapkan validasi ini antara lain: Nomor KTP, Nomor SIM, Nomor Handphone dan lain-lain. Yuk, mari baca dan simak tutorial ini sampai habis.

Membuat Validasi Angka

Untuk membuat validasi ini, Anda harus membuat sebuah function seperti berikut ini:

function validation(){
  var validasiAngka = /^[0-9]+$/;
  var tahunLahir = document.getElementById("tahun");
  if (tahunLahir.value.match(validasiAngka)) {
      alert("Tahun kelahiran Anda adalah " + tahunLahir.value);
  } else {
      alert("Masukkan tahun kelahiran Anda!\nFormat wajib angka!");
      tahunLahir.value="";
      tahunLahir.focus();
      return false;
  }
}

Penjelasan:
Baris ke-1 : Buka dan deklarasi nama function
Baris ke-2 : Deklarasi variable validasiAngka, berisi ReGex (Regular Expression) Angka.
Baris ke-3 : Deklarasi variable tahunLahir, berisi value dari element input.
Baris ke-4 : Mulai kondisi dengan formula validasi yaitu:
Jika tahunLahir mengandung Angka.
Baris ke-5 : Jika sesuai dengan formula kondisi maka alert dengan pesan “Tahun kelahiran Anda adalah (value dari element input)” akan muncul.
Baris ke-6 : else, pengecualian.
Baris ke-7 : Jika tidak sesuai dengan formula kondisi maka alert dengan pesan “Masukkan tahun kelahiran Anda! Format wajib angka!” akan muncul.
Baris ke-8 : Kosongkan atau reset element input.
Baris ke-9 : Memberikan fokus indikator pada element input.
Baris ke-10: Menahan agar tidak masuk ke proses selanjutnya.
Baris ke-11: Tutup kondisi
Baris ke-12: Tutup function

Mudah kan?

Untuk melakukan testing sudah Saya sertakan full source code-nya dibawah ini, Anda cukup copy paste script tersebut di komputer Anda masing-masing.

<html>
<head>
<script type="text/javascript">
function validation(){
  var validasiAngka = /^[0-9]+$/;
  var tahunLahir = document.getElementById("tahun");
  if (tahunLahir.value.match(validasiAngka)) {
      alert("Tahun kelahiran Anda adalah " + tahunLahir.value);
  } else {
      alert("Masukkan tahun kelahiran Anda!\nFormat wajib angka!");
      tahunLahir.value="";
      tahunLahir.focus();
      return false;
  }
}
</script>
</head>
<body>

Tahun Kelahiran:<br>
<input type="text" id="tahun">
<button onclick="validation()"> cek </button>

</body>
</html>

Demikian pembahasan tentang Cara Membuat Validasi Inputan Wajib Angka dengan JavaScript, semoga tulisan ini bisa memberikan manfaat untuk Anda yang membaca. Sampai jumpa di tulisan berikutnya. Terima Kasih

Apakah artikel ini membantu Anda?

klik bintang untuk memberikan nilai