Contoh membuat Validasi input angka dengan JavaScript
Validasi input angka merupakan salah satu fitur yang sangat penting dalam pengembangan aplikasi web. Fitur ini memungkinkan sistem untuk memvalidasi input data yang dimasukkan oleh pengguna pada formulir, sehingga meminimalisir kesalahan pada pengisian data. Dalam artikel ini, kita akan membahas contoh validasi input angka menggunakan JavaScript.
Menggunakan RegEx
RegEx (Regular Expression) adalah sebuah teknologi yang digunakan untuk mencari pola pada sebuah teks. Dalam validasi input angka, RegEx digunakan untuk memastikan bahwa input yang dimasukkan oleh pengguna adalah angka. Berikut adalah contoh penggunaan RegEx pada validasi input angka:
javascript
function validasiInputAngka(input) {
var regEx = /^[0-9]+$/;
if (regEx.test(input)) {
return true;
} else {
return false;
}
}
Pada script di atas, kita menggunakan RegEx untuk memastikan bahwa input yang dimasukkan hanya terdiri dari angka saja. Jika input yang dimasukkan tidak sesuai dengan pola yang telah ditentukan, maka sistem akan mengembalikan nilai false.
Menggunakan Metode isNaN()
Metode isNaN() merupakan sebuah metode pada JavaScript yang digunakan untuk memeriksa apakah sebuah nilai adalah angka atau bukan. Dalam validasi input angka, metode isNaN() digunakan untuk memastikan bahwa input yang dimasukkan adalah angka. Berikut adalah contoh penggunaan metode isNaN() pada validasi input angka:
javascript
function validasiInputAngka(input) {
if (isNaN(input)) {
return false;
} else {
return true;
}
}
Pada script di atas, kita menggunakan metode isNaN() untuk memastikan bahwa input yang dimasukkan adalah angka. Jika input yang dimasukkan bukan angka, maka sistem akan mengembalikan nilai false.
Menggunakan Metode parseInt()
Metode parseInt() merupakan sebuah metode pada JavaScript yang digunakan untuk mengubah sebuah string menjadi integer. Dalam validasi input angka, metode parseInt() digunakan untuk memastikan bahwa input yang dimasukkan adalah angka. Berikut adalah contoh penggunaan metode parseInt() pada validasi input angka:
javascript
function validasiInputAngka(input) {
var angka = parseInt(input);
if (isNaN(angka)) {
return false;
} else {
return true;
}
}
Pada script di atas, kita menggunakan metode parseInt() untuk mengubah input yang dimasukkan menjadi integer. Jika input yang dimasukkan bukan angka, maka sistem akan mengembalikan nilai false.
Menggunakan Metode parseFloat()
Metode parseFloat() merupakan sebuah metode pada JavaScript yang digunakan untuk mengubah sebuah string menjadi float. Dalam validasi input angka, metode parseFloat() digunakan untuk memastikan bahwa input yang dimasukkan adalah angka. Berikut adalah contoh penggunaan metode parseFloat() pada validasi input angka:
javascript
function validasiInputAngka(input) {
var angka = parseFloat(input);
if (isNaN(angka)) {
return false;
} else {
return true;
}
}
Pada script di atas, kita menggunakan metode parseFloat() untuk mengubah input yang dimasukkan menjadi float. Jika input yang dimasukkan bukan angka, maka sistem akan mengembalikan nilai false.
Menggunakan Metode isFinite()
Metode isFinite() merupakan sebuah metode pada JavaScript yang digunakan untuk memeriksa apakah sebuah nilai adalah bilangan terbatas atau tidak. Dalam validasi input angka, metode isFinite() digunakan untuk memastikan bahwa input yang dimasukkan adalah angka terbatas. Berikut adalah contoh penggunaan metode isFinite() pada validasi input angka:
javascript
function validasiInputAngka(input) {
if (isFinite(input)) {
return true;
} else {
return false;
}
}
Pada script di atas, kita menggunakan metode isFinite() untuk memastikan bahwa input yang dimasukkan adalah angka terbatas. Jika input yang dimasukkan tidak terbatas, maka sistem akan mengembalikan nilai false.
Menggunakan Metode Number()
Metode Number() merupakan sebuah metode pada JavaScript yang digunakan untuk mengubah sebuah nilai menjadi tipe data number. Dalam validasi input angka, metode Number() digunakan untuk memastikan bahwa input yang dimasukkan adalah angka. Berikut adalah contoh penggunaan metode Number() pada validasi input angka:
javascript
function validasiInputAngka(input) {
var angka = Number(input);
if (isNaN(angka)) {
return false;
} else {
return true;
}
}
Pada script di atas, kita menggunakan metode Number() untuk mengubah input yang dimasukkan menjadi number. Jika input yang dimasukkan bukan angka, maka sistem akan mengembalikan nilai false.
Kesimpulan
Validasi input angka pada JavaScript dapat dilakukan dengan beberapa cara, seperti menggunakan RegEx, metode isNaN(), metode parseInt(), metode parseFloat(), metode isFinite(), dan metode Number(). Setiap metode memiliki kelebihan dan kekurangan masing-masing, sehingga kita dapat memilih metode yang paling sesuai dengan kebutuhan kita. Dalam pengembangan aplikasi web, validasi input angka sangat penting untuk memastikan bahwa data yang dimasukkan oleh pengguna sudah benar dan sesuai dengan format yang diinginkan.
