MasRud.com
11 November 2018 / JavaScript

Tutorial Membuat Format Rupiah pada Input HTML

Selain fungsi yang berjalan dengan baik, programmer perlu mempertimbangkan user experience yang baik agar aplikasi tersebut mudah digunakan oleh end user.

Salah satu user experience yang bagus pada sebuah aplikasi adalah format input form yang sesuai dengan tipe data yang diinputkan.

Contohnya apabila data yang diinputkan berupa mata uang rupiah, maka input juga menunjukkan format rupiah. Untuk membuat format input seperti itu kita bisa memanfaatkan plugin jQuery Mask.

jQuery Mask adalah sebuah plugin jQuery yang digunakan untuk melakukan masking input, baik berupa format mata uang, nomor hp, ip address dan lain sebagainya.

Oke langsung saja, berikut adalah tutorial kustom format input mata uang rupiah.

Sebelum kita membuat kustom format input, siapkan dulu file jQuery dan jQuery Mask. Silakan download dulu file jQuery disini dan jQuery Mask disini.

Jika sudah lanjut ke tutorialnya.

  • Buat folder baru pada htdocs misalnya latihan (folder html jika kamu menggunakan Linux).
  • Lalu copy file jquery.min.js dan jquery.mask.min.js yang sudah kita download tadi dan paste pada folder latihan.
  • Setelah itu buat file baru bernama index.html lalu isi kode di bawah ini:

  • Lihat hasilnya dengan mengetikkan http://localhost/latihan/ pada browser.

Untuk kustom format lainnya bisa dilihat disini.

Demo kustom input

Mengubah Warna Address Bar Website pada Browser Smartphone

Membuat Format Rupiah dengan PHP

Membuat dan Memanipulasi (CRUD) JSON dengan PHP

Membuat Autocomplete dengan PHP dan MySQLi

Trik Minify Kode HTML Menggunakan PHP

Terbaru ☺️

Tutorial Installasi Postman pada Ubuntu/Linux Mint

Membuat Format Tanggal Ala Instagram dengan PHP

Tutorial Kirim Email dengan SMTP SendGrid pada CodeIgniter

Disqus Comments