Detect when input box filled by keyboard and when by barcode scanner. Detect when input box filled by keyboard and when by barcode scanner. javascript javascript

Detect when input box filled by keyboard and when by barcode scanner.


I wrote this answer, because my Barcode Scanner Motorola LS1203 generated keypress event, so I can't use Utkanos's solution.

My solution is:

var BarcodeScanerEvents = function() {     this.initialize.apply(this, arguments);};BarcodeScanerEvents.prototype = {    initialize: function() {       $(document).on({          keyup: $.proxy(this._keyup, this)       });    },    _timeoutHandler: 0,    _inputString: '',    _keyup: function (e) {        if (this._timeoutHandler) {            clearTimeout(this._timeoutHandler);            this._inputString += String.fromCharCode(e.which);        }         this._timeoutHandler = setTimeout($.proxy(function () {            if (this._inputString.length <= 3) {                this._inputString = '';                return;            }            $(document).trigger('onbarcodescaned', this._inputString);            this._inputString = '';        }, this), 20);    }};


Well a barcode won't fire any key events so you could do something like:

$('#my_field').on({    keypress: function() { typed_into = true; },    change: function() {        if (typed_into) {            alert('type');            typed_into = false; //reset type listener        } else {            alert('not type');        }    }});

Depending on when you want to evaluate this, you may want to do this check not on change but on submit, or whatever.


you can try following example, using jQuery plugin https://plugins.jquery.com/scannerdetection/

Its highly configurable, time based scanner detector. It can be used as solution for prefix/postfix based, time based barcode scanner.

Tutorial for usage and best practices, as well discussed about various Barcode Scanner Models and how to deal with it. http://a.kabachnik.info/jquery-scannerdetection-tutorial.html

$(window).ready(function(){	//$("#bCode").scannerDetection();	console.log('all is well');		$(window).scannerDetection();	$(window).bind('scannerDetectionComplete',function(e,data){            console.log('complete '+data.string);            $("#bCode").val(data.string);        })        .bind('scannerDetectionError',function(e,data){            console.log('detection error '+data.string);        })        .bind('scannerDetectionReceive',function(e,data){            console.log('Recieve');            console.log(data.evt.which);        })        //$(window).scannerDetection('success');
<input id='bCode'type='text' value='barcode appears here'/>