help with js form validation, check, wait, then submit

[edmiston00]

Hi,

I'm writing a web-program that takes input on a form from a barcode scanner. The barcode scanner converts the barcode to text and then uses keystrokes to type the text very quickly (< 1s) into input box. There is a chance that someone may key in a barcode by hand as well.

here's what i need:
1. verify form is at least 9 characters (some of my barcodes will be longer), if it is then:
2. wait 2 seconds and submit form
3. but if another keystroke occurs, clear the timer and wait 2 seconds from then (in case someone is typing by hand and isn't finished yet).

I have very basic JS experience and tried to splice two scripts together but I couldn't get it working, here is what I have (dont laugh!):

<script language="javascript">
function check(field)
{
if ( field.value.length >= 9 )
{
clearTimeout (t); 
var t=setTimeout("field.form.submit()",2000);
}	  
}
</script>

AND THE FORM

<form method="post" action="submit.php">
<input name="barcode" type="text" onkeyup="check(this);">
<input type="submit" value="go!">

please help me and if you can remove any unnecessary returns in my script, I need it to be as compact as possible (if you don't mind)

Thanks in adv.,
Chris Edmiston

[edmiston00]

fixed it myself! way to go chris! i'm a noob but trial and error and well, some duh moments.

so basically if you want to validate a form for minimum length, then wait a few seconds for more input before it submits automatically here you go:

<script language="javascript">
var t; 
function checkid(field) {
clearTimeout(t); 
if ( field.value.length >= 9 ) { 
t = setTimeout("document.forms.myform.submit();",2000); 
} 
}

and the html... works with our without a submit button

<form method="post" name="myform" action="http://localhost/test3.html">
<input name="memid" type="text" onkeyup="checkid(this);">
<input type="submit" value="go">

[edmiston00]

now just if i knew how to clean my code up to minimize the characters and lines it takes up.

[Old Pedant]

Only thing I see to make it smaller is you don't need ".forms" in there.

t = setTimeout("document.myform.submit()",2000);

What the heck, you could name the form "f" instead. On, and language=... is obsolete and deprecated.

<script type="text/javascript">
var t; 
function c(f){ clearTimeout(t); 
if ( f.value.length > 8 ) t = setTimeout("document.f.submit()",2000); }
</script>
...
<form method="post" name="f" action="test3.html">
<input name="memid" type="text" onkeyup="c(this);">
</form>

You could get rid of line breaks and some of the spaces, but I don't see it getting any shorter than that.

No, wait. I lied.

<script type="text/javascript">
var t; 
</script>
...
<form method="post" name="f" action="test3.html">
<input name="memid"
  onkeyup="clearTimeout(t);if(this.value.length>8)t=setTimeout('document.f.submit()',2000)">
</form>

Notice that I got rid of type=text. That's the default, so not needed. And used >8 instead of >=9.

How's that?

Now the big question: Why does the size matter that much?

[edmiston00]

Thanks for taking a look and cleaning it up!

I'm not sure if size matters THAT much, but I do appreciate learning new and more optimized ways of writing code more than anything else.

I also don't know a whole lot about server loads and people trying to access the same file at the same instant.

But, if I have my way when I'm done I would have something that could be used to count over 200 SKUs/UPCs that may be in 2 locations 52 times a year in 1500 stores.

By my calculations you saved me 77 characters so:

77x1500x52x2x200 = 2,402,400,000 bytes! Two gigs of bandwidth (or about $1.00! If I follow the same approach for the whole program, I might be able to save 10 or 20 gigs a year!

In reality, I guess I'm just a minimalist, no good excuse.