Here'z the script i have atm:
<html>
<HEAD>
<script language="javascript">
<!--
function autotab(original,destination){
if (original.getAttribute&&original.value.length==original.getAttribute("maxlength"))
destination.focus()
}
function validateNum()
{
// digits letters only
if ( event.srcElement.value.search(/[^0-9]/) != -1 )
{
alert("only digits in this field");
this.focus();
return false;
}
return true;
}
}
var bDone = false;
function getValue(o)
{
o.value = document.inputform.result.value.substring(document.inputform.result.value.length - o.maxLength);
document.inputform.result.value = document.inputform.result.value.substring(0,document.inputform.result.value.length - o.maxLength);
}
function back()
{
if ( bDone ) return;
<!-- fill in the values in reverse order-->
getValue(document.inputform.field3);
getValue(document.inputform.field2);
getValue(document.inputform.field1);
}
function next()
{
if ( bDone ) return;
if (
!document.inputform.field1.onchange() ||
!document.inputform.field2.onchange() ||
!document.inputform.field3.onchange() ) return;
document.inputform.result.value += document.inputform.field1.value + document.inputform.field2.value + document.inputform.field3.value;
document.inputform.field1.value = '';
document.inputform.field2.value = '';
document.inputform.field3.value = '';
}
function done()
{
bDone = true;
document.getElementById('spResult').style.display = '';
}
-->
</script>
</HEAD>
<body>
<form name=inputform>
<table>
<tr>
<td>Field 1:</td>
<td><input name=field1 type=text maxlength=1 onChange="java script:validateNum();" onKeyUp="autotab(this, document.inputform.field2)"></td>
</tr>
<tr>
<td>Field 2:</td>
<td><input name=field2 type=text maxlength=1 onChange="java script:validateNum();" onKeyUp="autotab(this, document.inputform.field3)"></td>
</tr>
<tr>
<td>Field 3:</td>
<td><input name=field3 type=text maxlength=1 onChange="java script:validateNum();" onKeyUp="autotab(this, document.inputform.nextbutton)"></td>
</tr>
</table>
<input name="previousbutton" type="button" value="Previous" onClick="back();">
<input name="nextbutton" type="button" value="Next" onClick="next();">
<input name="donebutton" type="button" value="Done" onClick="done();">
<span id=spResult style="display:none;"><input type=text name=result></span>
</form>
</body>
</html>
Now this gives me some problems:
When i filled in all the field correctly and hit the next button, it gives me the 'only digits in this field' alert. I don't know what causes that.
Second, when i click previous, all data inputed is supplied correctly, but let's say, when i click next again after 2 times previous it show all fields empty, if possible they should be filled in with the data (if there is any data that is)
Thirdly, i want to make it possible to override the autotab function when the user uses the Tab-key on the Keyboard so that adjustements can be made.
Hope u can help me on these matters
Thx in advance