views:

788

answers:

2

I noticed prior to posting this question that there have been similar questions posted on this topic before, however the user isn't interacting with the text field by using the keyboard in this instance, in such case binding the text field to the "Paste" action or any of the other nifty suggestions wouldn't work in my case.

Our users are inputting a string value that is scanned in from a Bar Code. What we're attempting to do is to avoid the annoyance of having the user put the scanner down to go to the next field after scanning in the information. However, I'm having an issue detecting the change in value of a text field while it still has focus.

This is the only part of the puzzle that we're missing, because to apply focus to the next field on the form is trivial. Can anyone shed light on how to detect a change in value of a text field when the input device is NOT the keyboard? I've already tried using the change() event but it doesn't fire until the field no longer has focus.

Thanks in Advance!

  • Will
A: 

Well, there's always brute force: poll it with a setInterval().

chaos
+4  A: 

You can just listen for the keypress event.

<input type="text" id="target" value="" />

var target = $('#target'),
    val = target.val();

function monitor()
{
    var current_val = $(this).val();
    if (current_val != val) {
        console.log('changed from', val, 'to', current_val);
        val = current_val;
    }
}

target.keypress(monitor);
Reinis I.
Keypress worked perfectly. For some reason I had code in the callback function that was causing the input to get cut off. Thanks!!!
WillMatt
You're welcome.
Reinis I.
What about inserting value with a mouse, or programmatically changing the value or forms auto-fill feature? Only deadly polling?
Roman
Actually the proper event to use in this instance is .keyup() because you want to update after the value has been entered, not before. Using .keypress() will result in missing the last character typed.
dskvr