Highlighted

Tab = Enter

Explorer ,
Mar 30, 2018

Copy link to clipboard

Copied

I have a form that we scan a single number into.  The barcode scanner has an "Enter" built in to it after it scans.

The problem is that these scanners are used for many other programs in our lab that all need a "Tab" and staff have to frequently switch them back and forth between tab and enter.

My form is one simple field and a submit key, so scanning now captures the data and submits it.

Can the form be set to submit when a "Tab" is sent?  So it would be: scan data --> Tab = data submitted.

Thanks

Views

320

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

Tab = Enter

Explorer ,
Mar 30, 2018

Copy link to clipboard

Copied

I have a form that we scan a single number into.  The barcode scanner has an "Enter" built in to it after it scans.

The problem is that these scanners are used for many other programs in our lab that all need a "Tab" and staff have to frequently switch them back and forth between tab and enter.

My form is one simple field and a submit key, so scanning now captures the data and submits it.

Can the form be set to submit when a "Tab" is sent?  So it would be: scan data --> Tab = data submitted.

Thanks

Views

321

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Mar 30, 2018 0
LEGEND ,
Mar 30, 2018

Copy link to clipboard

Copied

I think you can use JavaScript to accomplish that.  Set the field so that onBlur="this.form.submit();" and onChange="this.blur();"

Not tested, but I think theoretically it will work.

V/r,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 30, 2018 0
LEGEND ,
Mar 30, 2018

Copy link to clipboard

Copied

Okay.. I was close. 

<form><input type="text" onBlur="this.form.submit();" id="testing" oninput="this.blur();"  /></form>

HTH,

^ _ ^

UPDATE:  According to caniuse, there are minor issues with using oninput, but it enjoys full support in FF since 3.6, Chrome since 15.0, Safari since 6.1, IE since 10, and Edge since 12.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 30, 2018 0
LEGEND ,
Mar 30, 2018

Copy link to clipboard

Copied

You can even do it like so:

<form id="testSubmit"><input type="text" id="testing"  /></form>

<script type="text/javascript">

    var testSubmit = document.getElementById('testSubmit'),

          testing = document.getElementById('testing');

    function submitIt(){testSubmit.submit();}

    function blurIt(){testing.blur();}

    testing.addEventListener('blur',submitIt);

    testing.addEventListener('input',blurIt);

</script>

V/r,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 30, 2018 0
Explorer ,
Mar 30, 2018

Copy link to clipboard

Copied

WolfShade, you are awesome, thank you, I will test it next week when I am back to work.

Thank you!

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Mar 30, 2018 0
Explorer ,
Apr 02, 2018

Copy link to clipboard

Copied

I'm sure it's something I did.  I tried the option below.  After I enter one character in the form (if typed manually) it submits.

I need to be able to type or scan the unit number into the form, then when the TAB character is received, submit the form.

WolfShade  wrote

You can even do it like so:

<form id="testSubmit"><input type="text" id="testing"  /></form> <script type="text/javascript">     var testSubmit = document.getElementById('testSubmit'),           testing = document.getElementById('testing');     function submitIt(){testSubmit.submit();}     function blurIt(){testing.blur();}     testing.addEventListener('blur',submitIt);     testing.addEventListener('input',blurIt); </script>

V/r,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 02, 2018 0
LEGEND ,
Apr 02, 2018

Copy link to clipboard

Copied

Precisely.  If your scanner is currently set to populate the one field with one character, then when that one character is entered into the field the form will submit.

I don't work with scanners, so am not familiar with how they work in conjunction with HTML forms, but if you know that part, then applying my methodology to your form should be a breeze.

HTH,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 02, 2018 0
LEGEND ,
Apr 02, 2018

Copy link to clipboard

Copied

I just re-read your original post.  If the scanner automatically tabs after entering the single number into the field, then all you need is the submit part of the code.

<form id="testSubmit"><input type="text" id="testing"  /></form> 
<script type="text/javascript"> 
    var testSubmit = document.getElementById('testSubmit'),

     testing = document.getElementById('testing'); 
    function submitIt(){testSubmit.submit();}
    testing.addEventListener('blur',submitIt); 
</script>

If you want to manually enter a number and manually tab, then the above will also work.

If you want the form to automatically submit after a value is entered, the first set of code I provided will do that.

HTH,

^ _ ^

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Apr 02, 2018 0