CleaveJS: JS Library Untuk Membuat Aneka Format Angka Pada Form Input

CleaveJS: JS Library Untuk Membuat Aneka Format Angka Pada Form Input


Bagi seorang koder web, atau istilah lain yang lebih formal, Anda sebutkan sendiri ya. Sudah pasti akan ketemu dengan case dimana Anda harus membuat form inputan menyesuaikan pola yang dibutuhkan misalkan menggunakan tanggal lahir ketimbang menggunakan Datepicker. Atau membuat pola untuk mata uang, yang lumrah di temui aplikasi POS maupun backend Ecommerce. 


Banyak cara yang bisa dilakukan, terlebih lagi seorang koder memiliki caranya masing-masing, yang dirasa efisien untuk dilakukan. Ada yang membuat javascript function sendiri, ada yang menggunakan JQuery Library seperti Jquery Mask https://igorescobar.github.io/jQuery-Mask-Plugin/. Namun yang merasa kurang efisien apabila menyisipkan JQuery kedalam halaman HTML memilih untuk mencari Javascript Library yang standalone. Terlebih lagi kabar dari pengembang Bootstrap bahwa kedepannya tidak lagi ada JQuery dalam Bootstrap, Bootstrap lebih memilih vanilla JS ketimbang JQuery https://hub.packtpub.com/bootstrap-5-to-replace-jquery-with-vanilla-javascript/  

Untuk membuat format Angka pada form inputan text yang tidak bergantung kepada JQuery bisa menggunakan CleaveJS untuk demo lengkapnya bisa Anda cek di sini https://nosir.github.io/cleave.js/ , dokumentasi penggunaannya bisa Anda cek di https://github.com/nosir/cleave.js 

Berikut contoh demo penggunaan CleaveJS

See the Pen Contoh Penggunaan CleaveJS by Ilmuwebsite (@ilmuwebsite) on CodePen.

 

Selamat mencoba

Artikel Terkait :