Alat Barcode Scanner bekerja hampir sama seperti keyboard. Barcode Scanner akan membaca kode barcode dalam bentuk kode bar (gambar) dan menampilkannya dalam bentuk output berupa kode barcode (text). Barcode Scanner sangat membantu mempercepat pencarian data suatu barang dalam database dan menampilkannya dalam bentuk informasi lengkap tentang data barang tersebut.
Aplikasi yang menggunakan media barcode scanner banyak digunakan pada aplikasi kasir, aplikasi inventori maupun aplikasi perpustakaan. Aplikasi tersebut kebanyakan menggunakan program dalam lingkungan VB Net maupun Java. Namun aplikasi barcode juga dapat diterapkan pada lingkungan berbasis web development dengan program PHP sebagai eksekutornya.
Cara Kerja Barcode Scanner
Produk Barcode Scanner banyak tersedia di pasaran dengan harga mulai dari 300 ribuan sampai 1 jutaan tergantung dari type dan jenis mesin barcode. Sama halnya seperti keyboard, barcode scanner juga merupakan media input pada komputer yang berfungsi sebagai masukkan data teks pada komputer.
Cara kerja mesin Barcode Scanner adalah dengan membaca kode bar dalam bentuk gambar, kemudian menampilkannya dalam bentuk teks. Hal yang perlu digaris bawahi adalah cara dalam menampilkan hasil pembacaan scanner. Alat tersebut akan mengetikkan satu persatu karakter dari kode yang sudah dibaca tersebut dan diakhiri dengan tombol enter. Jika anda menduga cara kerjanya sama seperti cara kerja pada proses copy dan paste untuk sekumpulan teks, hal tersebut adalah tidak benar.
Pada HTML, Barcode Scanner sebagai media input data hanya dapat berfungsi dengan baik jika elemen yang sedang aktif tersebut adalah dalam bentuk elemen tag type text dan juga .
Menggunakan Barcode Scanner Pada Elemen HTML Input Type Text
Seperti yang sudah dijelaskan diatas, bahwa alat Barcode Scanner akan menghasilkan Carriage Return atau karakter enter pada setiap akhir inputan data. Jika diterapkan mentah-mentah pada type text tanpa rekayasa Javascript, maka form akan disubmit dan menuju halaman pemroses.
Fungsi Javascript yang dapat digunakan untuk menghindari hal di atas adalah dengan memakai fungsi on keyup(), on keydown() ataupun on keypress(). Kemudian mengambil data input yang dimasukkan oleh Scanner, dan jika Carriage Return (Code 13) ditemukan, maka data akan ditampilkan pada bilah input tersebut (baris ke-33 s.d 35). Enter Your Barcode :
Clear Text
Jika diakses pada browser akan menghasilkan tampilan :
Elemen HTML type text tersebut digunakan untuk menampilkan hasil scan mesin barcode. Jika mesin barcode berhasil membaca kode barnya, maka hasilnya akan muncul pada bilah input tersebut. Berikut video hasil proses scanning barcode beberapa produk yang digunakan sebagai contoh :
00:00:00.000 –> 00:00:18.000 how to use barcode in htmlBrowser is not supported
Pada contoh di atas, halaman tidak menggunakan elemen HTML tag
yang akan melakukan redirect langsung menuju halaman tertentu. Hal ini untuk menghindari proses tersubmit-nya form. Dan metode ini cocok jika pengiriman data menggunakan AJAX dengan proses di balik layar. Jika menggunakan elemen HTML tag dapat melakukan pemblokiran proses melalui Script Javascript maupun Jquery agar formulir tidak tersubmit secara otomatis.
Menggunakan Barcode Scanner Pada Elemen HTML Textarea
Penggunaan Barcode Scanner pada elemen HTML berupa merupakan alternatif kedua yang bisa digunakan selain elemen tag . Jika penggunaan scanner pada type text menghasilkan form yang akan disubmit untuk menuju halaman pemroses, lain halnya jika diterapkan pada . Penerapan Barcode Scanner pada akan mendapatkan hasil scan dalam bentuk teks dengan disertai karakter Carriage Return (enter). Dan ini artinya teks hasil scan diposisikan pada baris pertama dan baris kedua diisi oleh pointer yang berkedip di dalam tersebut.
Jika hal tersebut digunakan untuk membandingkan data, tentu saja bukan hal yang baik. Karena yang diperlukan adalah hasil scan untuk satu produk saja, tidak dalam bentuk multi produk. Untuk itu, perlu dilakukan rekayasa script pada javascript. Caranya dengan menggunakan fungsi javascript on keyup(), on keydown(), ataupun on keypress() pada elemen tersebut. Kemudian jika ditemukan karakter Carriage Return (Code 13), maka data yang ada di dalamnya ditampilkan (baris ke-33 s.d 35). Enter Your Barcode :
Clear Text
Berikut tampilan jika halaman tersebut diakses pada browser :
Berikut video lengkap proses input data dengan barcode scanner pada elemen HTML berupa text area :
00:00:00.000 –> 00:00:18.000 how to use barcode in htmlBrowser is not supported
18 Sept .941
Kategori : html – javascript – support – barcode – qrcode