Created
September 6, 2020 02:35
-
-
Save rezafikkri/5b70a51cf5e53a324cde234c798318d5 to your computer and use it in GitHub Desktop.
Filter Input Number, menggunakan input type text
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| document.getElementById("floatTextBox").addEventListener('input', function (event) { | |
| // jika value yang dimasukkan pertama adalah karakter (-), langsung keluar dari function | |
| if(this.value === '-') return 0; | |
| // selain dari itu, jika value input cocok dengan expression | |
| if(/^-?\d+(,|\.)?\d*$/.test(this.value)) { | |
| // set oldValue = value input dan keluar dari function | |
| this.oldValue = this.value; return 0; | |
| } | |
| // selain dari itu, jika property oldValue ada dan length value = 0; ini untuk menghandle ketika kita menekan backspace dan value di input hanya tinggal 1 karakter | |
| if(this.hasOwnProperty('oldValue') && this.value.length === 0) { | |
| // kosongkan value, hapus property oldValue dan keluar dari function | |
| this.value = ''; delete this.oldValue; return 0; | |
| } | |
| // selain dari itu, jika property oldValue ada; ini untuk menghandle jika value di input ada tetapi yang dimasukkan ada karakter selain angka, atau memasukkan karakter (.) atau karakter (,) untuk kedua kalinya. | |
| if(this.hasOwnProperty('oldValue')) { | |
| // set value = value lama dan keluar dari function | |
| this.value = this.oldValue; return 0; | |
| } | |
| // selain dari itu semua, kosongkan value; ini untuk menghandle jika yang dimasukkan pertama kali buka karakter (-) dan angka | |
| this.value = ''; | |
| }); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Live Preview: https://jsfiddle.net/rezafikri/ey3nbtpc/4/
Tested on: Mozilla Firefox 78 and Google Chrome 83