For starters, the screen capture I am going to reference is at http://pcsspanish.com/image.jpg. Thanks.

Sorry, but being a teacher I had to block the names of my students on the screen capture pic. Okay, so, I've got this javascript which puts the desired grade in the field. I use this for quick placement so the teacher doesn't HAVE to type in the grade for each one. This is optimized for the ipad, so I'm trying to give the teacher the ability to avoid typing.

So here's how it works. You tap the '100' button and a 100 appears in the field for that student, and so on. I have two problems, and both of them are major as far as I'm concerned:

Problem 1: When I tap a grade button, the grade appears in the field, however, the cursor 'focuses' on that field also, which pulls up the keyboard. I absolutely cannot have that! After putting in the grade, I need the field to lose focus.

Problem 2: As you may be able to tell. I assigned the grade 100 for the first student, a 90 for the second, an 80, then a 70, a 60, a 50 and a 0. But look at the 3rd student and the 6th student. For the third student, I first assigned an 80, and then I went back and re-assigned it as a 50. As you can see, the 50 split the numbers '8' and '0' to make '8500'. For the 6th student I assigned a 50. I then went back and tapped a 90. Once again the 90 split the '5' and the 0' to make '5900'. What I need is for the javascript to clear any current contents of the field before putting in the new value.

I have to solve both of these or else the concept is no good for me. Please help.

- James

Javascript Function:
Code:
<script type="text/javascript">

function insertAtCursor(fieldID, insertValue)
{
  var fieldObj = document.getElementById(fieldID);

  if (document.selection)
  { //IE support
    fieldObj.focus();
    document.selection.createRange().text = insertValue;
  }
  else if (fieldObj.selectionStart || fieldObj.selectionStart=='0')
  { //MOZILLA/NETSCAPE support
    endPos = fieldObj.selectionStart+1;
    fieldObj.value = fieldObj.value.substring(0, fieldObj.selectionStart) + insertValue
                   + fieldObj.value.substring(fieldObj.selectionEnd, fieldObj.value.length);
    fieldObj.selectionStart = endPos
    fieldObj.selectionEnd = endPos
    fieldObj.focus();
  }
  else
  {
    fieldObj.value += insertValue;
  }
}

</script>
Button Code: (please forgive this is done in PHP so that I can increment the field id variable). The code works. I just need my two problems solved. THANK YOU.
Code:
	print "<img src=\"resources/assign_100.jpg\" style=\"margin-left: 10px;\" onclick=\"insertAtCursor('helio".$count."', '100');\">\n";
	print "<img src=\"resources/assign_90.jpg\" style=\"margin-left: 10px;\" onclick=\"insertAtCursor('helio".$count."', '90');\">\n";
	print "<img src=\"resources/assign_80.jpg\" style=\"margin-left: 10px;\" onclick=\"insertAtCursor('helio".$count."', '80');\">\n";
	print "<img src=\"resources/assign_70.jpg\" style=\"margin-left: 10px;\" onclick=\"insertAtCursor('helio".$count."', '70');\">\n";
	print "<img src=\"resources/assign_60.jpg\" style=\"margin-left: 10px;\" onclick=\"insertAtCursor('helio".$count."', '60');\">\n";
	print "<img src=\"resources/assign_50.jpg\" style=\"margin-left: 10px;\" onclick=\"insertAtCursor('helio".$count."', '50');\">\n";
	print "<img src=\"resources/assign_0.jpg\" style=\"margin-left: 10px;\" onclick=\"insertAtCursor('helio".$count."', '0');\">\n\n";