I am using QR Code Reader JavaScript.
This JavaScript captures image using camera, tries to decode QR Code and set the decoded text to TextArea as output.

This is working well.

But when text set to TextArea I need to capture event so I can do further processing.

I have tried different binations with available solutions as follows:

1st

$('.barcodeInput').change(function(){
    debugger;
    alert("changed");
});

2nd

$('body').delegate('.barcodeInput', 'keyup change', function(){
    alert("changed");
});

3rd

$('.barcodeInput').bind('input propertychange', function () {
    debugger;
    alert("changed");
});

I have defined all these in and out side of document.ready(function(){ // code here});

But still it is not wroking.

My QR Code decoding JavaScript set text to TextArea after successful decoding.

I can trigger event manually form that JavaScript but that will be patch work.

I want permanent solution for problem like these.

Thanks is advance

I am using QR Code Reader JavaScript.
This JavaScript captures image using camera, tries to decode QR Code and set the decoded text to TextArea as output.

This is working well.

But when text set to TextArea I need to capture event so I can do further processing.

I have tried different binations with available solutions as follows:

1st

$('.barcodeInput').change(function(){
    debugger;
    alert("changed");
});

2nd

$('body').delegate('.barcodeInput', 'keyup change', function(){
    alert("changed");
});

3rd

$('.barcodeInput').bind('input propertychange', function () {
    debugger;
    alert("changed");
});

I have defined all these in and out side of document.ready(function(){ // code here});

But still it is not wroking.

My QR Code decoding JavaScript set text to TextArea after successful decoding.

I can trigger event manually form that JavaScript but that will be patch work.

I want permanent solution for problem like these.

Thanks is advance

• javascript
• jquery

• I'm not sure what your actual problem is, but change only fires when the element loses focus. Try using input instead. – Rory McCrossan Commented Mar 3, 2017 at 9:57
• How about your jquery version? why don't you try with .on() listener? – Jai Commented Mar 3, 2017 at 9:57
• Does your plugin fires trigger('change') event when changing Textarea value? – Justinas Commented Mar 3, 2017 at 9:58

1 Answer 1

You could attach the event using change() or .on(), like :

$('.barcodeInput').change(function(){
    alert("changed");
});
//Or
$('.barcodeInput').on('change', function(){
    alert("changed");
});

And you could invoke the event when you change the text :

textarea.val('new val').change();
//Or
textarea.val('new val').trigger('change');

NOTE : bind and delegate are deprecated.

Hope this helps.

$('.barcodeInput').on('change', function(){
    alert("changed");
});

$('.barcodeInput').val('new val').change();

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea class='barcodeInput'></textarea>