Wrox Home  
Search P2P Archive for: Go

  Return to Index  

javascript_howto thread: keyboard arrows to move around in a form, is it possible?


Message #1 by "Becky Holmes" <rebeholm@h...> on Wed, 3 Apr 2002 20:10:01
Maybe some of the code belowe can be of asistance. Regarding both the tab-
and the calculation issues. You have to adjust the index values to fit your
form thou.
/Peter

<script language="JavaScript">
function tab(element,key){
var keyCase = key;
var form = document.fields;
 if((keyCase == 38)||(keyCase == 40)){
  for(i=0;i<form.elements.length-1;i++){
   if(form.elements[i].name == element){
    switch(keyCase){
     case 38:
      if(i>0){form.elements[i-1].focus();}
      break;
     case 40:
      if(i<form.elements.length-2){form.elements[i+1].focus();}
      break;
    }
   }
  }
 }
}
function add(num){
var form = document.fields;
form.result.value=0;

 for(i=0;i<form.elements.length-1;i++){
  if(!isNaN(parseInt(form.elements[i].value))){
   form.result.value = parseInt(form.result.value) +
parseInt(form.elements[i].value);
  }
 }
}
</script>

<form name="fields">
<input type="text" name="numberheard1"
onkeydown="tab(this.name,event.keyCode)" onkeyup="add(this.value)"><br>
<input type="text" name="numberheard2"
onkeydown="tab(this.name,event.keyCode)" onkeyup="add(this.value)"><br>
<input type="text" name="numberheard3"
onkeydown="tab(this.name,event.keyCode)" onkeyup="add(this.value)"><br>
Result:<br>
<input type="text" name="result">
</form>




  Return to Index