How to fill-in two input[text] in an HTML form using a barcode reader?

Question

I have a web page with one input text for the barcode content and a select for the barcode type.

So using the database, it is possible to generate the barcode in the good format.

A normal final user don't know which barcode as which type, but the barcode reader knows and can send this type as a keyboard input.

The problem is that I don't know how to change from the input to the select.

If I use, the \t, it prints a tabulation in the input instead of switching from a input to the other. If I use a \n it submit the form.

Do you have any idea of how I can do it so that my form can be use with or without the barcode reader?

It could print the barcode followed with the barcode type 6931442700194|EAN13 and split the content when processing the form but is there another solution?

Answer 1

You can use some Javascript and the onchange event (or some similar event) to detect the value of your input text has been changed (by your barcode reader). Then you get this value and split it over your input text and select.

<input type='text' id='inputtext' onchange='splitValue();' />
<select id='myselect'>...</select>

And the JavaScript

function splitValue()
{
    var input=document.getElementById('inputtext');
    var select=document.getElementById('myselect');
    var test = input.value;

    // Perform some splitting and formatting

    input.value = splitted_inputvalue;
    select.value = splitted_selectvalue;
}