Whoops, I just discovered Page 2 after drafting something.
Much simpler than Essential's but here it is anyway:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="javascript" type="text/javascript">
function checkForm(f){
var barcodeDefault = "Enter a barcode";
if( f.barcode.value == '' || f.barcode.value == barcodeDefault ){
f.barcode.value = barcodeDefault;
return false;
}
else{ return true; }
}
onload = function(){
checkForm(document.forms.barcodeForm);
}
</script>
</head>
<body>
<form id="barcodeForm" action="action.php" method="post" onsubmit="return checkForm(this);">
<input name="barcode" type="text" value="" onfocus="this.value=''" onblur="if(checkForm(this.form))this.form.submit();" />
<input type="submit" value="Add" />
</form>
</body>
</html>
As you will see, two events, barcode onblur and clicking Add, both cause the function checkForm() to be called, which in turn calls barcodeValid() (my test is VERY simple and can no doubt be improved).
On failure, checkForm puts a message in the barcode field and returnns false - thereby suppressing form submission. If the barcode is valid then the function returns true and form submission is allowed.
Just to round things off, checkForm is called on page load to cause the "Enter a barcode" message to appear in the barcode field by default.
I think that's about it. Probably too simple but the general structure may be about right.
Hope it helps
Airshow