New Topic/Question
Reply
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="Javascript">
function submitForm()
{
document.form1.submit();
}
</script>
</head>
<body>
<body onload="document.form1.barcode.focus()">
<form id="form1" name="form1" method="get" action="write_to_file.php">
<label for="textfield"></label>
<table width="403" border="1">
<tr>
<td width="200">Barcode</td>
<td width="200">Vendor Roll ID</td>
</tr>
<tr>
<td><input name="barcode" type="text" id="barcode" size="30" onchange="document.form1.vendor_id.focus()"/></td>
<td><input name="vendor_id" type="text" id="vendor_id" size="30" onchange="javascript: submitForm();"/></td>
</tr>
</table>
<p> </p>
</form>
</body>
</html>
So I decided to try to create a form that would dynamically add additional text fields to the form and also a submit button so the user could decide when they wanted to do the database update. All works fine when I am tabbing through the form - but with the scanner it see's the input as text and an enter. Therefore the form get submitted. Is there a way to tell the form that the text field need to be tabbed and not entered?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script language="Javascript">
var counter = 1;
var limit = 100;
function addInput(divName){
if (counter == limit) {
alert("You have reached the limit of adding " + counter + " inputs");
}
else {
var newdiv = document.createElement('div');
newdiv.innerHTML = "Barcode " + (counter + 1) + " <br><input type='text' name='myInputs[]' onchange=addInput2('dynamicInput2');onchange=SetFocus('test" + (counter + 2) + "'); id='test" + (counter + 1) + "'>";
document.getElementById(divName).appendChild(newdiv);
counter++;
}
}
</script>
<script language="Javascript">
var counter = 1;
var limit = 100;
function addInput2(divName){
if (counter == limit) {
alert("You have reached the limit of adding " + counter + " inputs");
}
else {
var newdiv = document.createElement('div');
newdiv.innerHTML = "Vendor Roll ID " + (counter + 1) + " <br><input type='text' name='myInputs[]' onchange=addInput('dynamicInput');onchange=SetFocus('test" + (counter + 2) + "') id='test" + (counter + 1) + "'>";
document.getElementById(divName).appendChild(newdiv);
counter++;
}
}
</script>
<script>
function SetFocus(test)
{
var control = document.getElementById(test);
if ( control != null )
{
//alert(" value is empty");
if ( control.focus != null )
{
control.focus();
}
}
}
</script>
<script>
function SetFocus(test2)
{
var control = document.getElementById(test2);
if ( control != null )
{
//alert(" value is empty");
if ( control.focus != null )
{
control.focus();
}
}
}
</script>
</head>
<body>
<body onload="document.form1.barcode.focus()">
<form id="form1" name="form1" method="POST" action="php_test.php">
<label for="textfield"></label>
<table width="403" border="1">
<tr>
<td width="200">Barcode</td>
<td width="200">Vendor Roll ID</td>
</tr>
<tr>
<td> <div id="dynamicInput"><br><input type="text" name='myInputs[]' size="30" onchange="document.form1.vendor_id.focus();" id="barcode"></td>
<td> <div id="dynamicInput2"><br><input type="text" name='myInputs[]' size="30" onchange="addInput('dynamicInput');SetFocus('test2');" id="vendor_id"></td>
</div>
</tr>
<td><input type="submit" name="submit" id="submit" value="Submit" /></td>
</table>
<p> </p>
</form>
</body>
</html>
I don't know if I am explaining myself correctly - just ask if you need more clarification.
Thanks in advance,
Steve
MultiQuote
| 