Handling character input type number

Tips dan trik kali ini akan membahas tentang bagaimana membatasi jenis karakter yang dapat di input pada kolom input. Seperti yang kita tau bahwa tipe kolom input pada HTML banyak jenis nya tergantung dari yang di butuhkan, contohnya text, number, email, password dan masih banyak lagi.

Biasanya ketika membuat suatu form HTML kita dapat mengatur length atau panjang dari suatu karakter. Password misal nya, length dapat di atur menjadi 6 karakter saja. Tapi bagaimana jika kita membatasi jenis karakter apa saja yang dapat di input?

 Jika kita ingin membuat kolom input untuk nomor telepon, mungkin saja kita dapat menggunakan tipe kolom input number. Tapi perlu di ketahui pula bahwa tipe number bisa memasukkan karakter titik (.) , koma (,) mengingat bahwa tipe ini dapat di pakai untuk decimal, sementara nomor telepon tidak boleh decimal. 

Lalu bagaimana solusi nya?

Kita perlu tahu dulu karakter apa aja yang akan di pakai, dalam hal ini hanya akan memakai angka.
Nah, untuk tipe dari kolom input nya kita akan pakai text saja, kenapa? Pada gambar di atas terlihat di samping kanan ada panah atas bawah yang artinnya angka terakhir dapat di naikkan jumlah nya atau di turunkan, kita tidak memerlukan itu. Maka kita buat pada HTML nya seperti gambar di bawah

Di dalam div ada id = "staticParent" dan di dalam input ada id = "child" , kedua id ini akan memanggil script yang isi nya character yg tidak boleh muncul sesuai kode asci.

Di karena kan script terlalu panjang jadi di bagi 3 gambar, (penempatan gambar ke 2 setelah tanda && pada gambar 1, kemudian di lanjutkan gambar ke 3). Angka2 pada script di atas menunjukkan kode asci dari karakter yang ada pada keyboard, sehingga bila kita mengetikan sesuatu yang angka asci nya ada pada script di atas maka tidak akan muncul pada layar. Dan hasil nya..

Nomor telepon tidak ada lagi panah atas bawah (karena tipe kolom input nya text), tidak bisa input karakter lain selain angka. 

Demikian tips dan trick untuk kali ini, semoga bermanfaat dan selamat mencoba.