Hallo sobat mitra tekno niaga, pada tulisan kali ini Kami ingin memberikan tutorial sederhana tentang bagaimana cara membuat sebuah validasi inputan wajib menggunakan Huruf. 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: Nama, Tempat Lahir, Nama Kota dan lain-lain. Yuk, mari baca dan simak tutorial ini sampai habis.
Untuk membuat validasi ini, Anda harus membuat sebuah function seperti berikut ini:
function validation(){
var validasiHuruf = /^[a-zA-Z ]+$/;
var nama = document.getElementById("nama");
if (nama.value.match(validasiHuruf)) {
alert("Nama Anda adalah " + nama.value);
} else {
alert("Masukkan nama Anda!nFormat wajib huruf!");
nama.value="";
nama.focus();
return false;
}
}
Penjelasan:
Baris ke-1 : Buka dan deklarasi nama function
Baris ke-2 : Deklarasi variable validasiHuruf, berisi ReGex (Regular Expression) Huruf atau Letter.
Baris ke-3 : Deklarasi variable nama, berisi value dari element input.
Baris ke-4 : Mulai kondisi dengan formula validasi yaitu:
Jika nama mengandung Huruf.
Baris ke-5 : Jika sesuai dengan formula kondisi maka alert dengan pesan “Nama 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 nama Anda! Format wajib huruf!” 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?
Baca Juga: Cara Membuat Validasi Inputan Wajib Angka dengan JavaScript
Untuk melakukan testing sudah Kami 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 validasiHuruf = /^[a-zA-Z ]+$/;
var nama = document.getElementById("nama");
if (nama.value.match(validasiHuruf)) {
alert("Nama Anda adalah " + nama.value);
} else {
alert("Masukkan nama Anda!nFormat wajib huruf!");
nama.value="";
nama.focus();
return false;
}
}
</script>
</head>
<body>
Nama:<br>
<input type="text" id="nama">
<button onclick="validation()"> cek </button>
</body>
</html>
Demikian pembahasan tentang Cara Membuat Validasi Inputan Wajib Huruf dengan JavaScript, semoga tulisan ini bisa memberikan manfaat untuk Anda yang membaca. Sampai jumpa di tulisan berikutnya. Terima Kasih