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
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,
^ _ ^
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.
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,
^ _ ^
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!
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,
^ _ ^
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,
^ _ ^
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,
^ _ ^