Find solution
How to encrypt JavaScript code?

Javascript keyboard data entry code

  • I need to be able to add javascript code to an html form to enable a keyboard controlled "data entry" system. Here is what I would like specifically. I have form/table with rows of radio buttons, each representing a number for input. I want the user to be able to have the focus on the first row. By hitting the number on the keypad that button will be selected and the focus will then move to the next row, and so on. Preferably, I would like a button that would activate/de-activate the javascript, so the user could get out of the automated data entry. The best implementation would be taking this sample html table form and putting in the necessary javascript to do it. Go here for html sample: http://daydream.stanford.edu/google_javascript.html I could not find an example of this, but I have no reason to be believe it's not possible. I do know java and html well, but very little javascript. I would like to see this working, so either a simple web page that does this with the source code (a complex page would be difficult to understand) or the provided html form with the javascript added (preferred).

  • Answer:

    Hello, linuxgeek: I have written some javascript code that works in the way you want, that is, when the page is loaded, it sets the focus to the first "no reply" radiobutton and waits for a key, when it's pressed and it's a number between 0 and 4, then, checks the appropiate option and sets the focus to the next "no reply" radiobutton. I'm sure you will need some adjustments, so feel free to request for any clarification, I will work on this answer until you get what you need. Here is the code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <!-- saved from url=(0051)http://daydream.stanford.edu/google_javascript.html --> <HTML><HEAD> <META http-equiv=Content-Type content="text/html; charset=windows-1252"> <META content="MSHTML 6.00.2800.1276" name=GENERATOR> <script language="JavaScript" type="text/JavaScript"> <!-- function setFocus(num) { var f=document.hamdForm; switch(num) { case 1: f.reply1[0].checked=true; f.reply1[0].focus(); break; case 2: f.reply2[0].checked=true; f.reply1[0].focus(); break; case 3: f.reply3[0].checked=true; f.reply1[0].focus(); break; } } function setOption(num,opt) { var f=document.hamdForm; switch(num) { case 1: f.reply1[opt].checked=true; break; case 2: f.reply2[opt].checked=true; break; case 3: f.reply3[opt].checked=true; break; } } function getFocused() { var f=document.hamdForm; if (f.reply1[0].checked) return(1); else if (f.reply2[0].checked) return(2); else if (f.reply3[0].checked) return(3); } IE4 = (document.all); NS4 = (document.layers); if (NS4) document.captureEvents(Event.KEYPRESS); document.onkeypress = doKey; function doKey(e) { whichASC = (NS4) ? e.which : event.keyCode; if ((whichASC>=48) && (whichASC<=52)) { row=getFocused(); setOption(row,whichASC-47); setFocus(row+1); } } //--> </script> </HEAD> <BODY onLoad="setFocus(1)"> <FORM name=hamdForm action=/apples/saveHamd.do method=post><INPUT type=hidden value=3316dae217ce99d8b957022a5e1b5e3 name=org.apache.struts.taglib.html.TOKEN> <TABLE cellSpacing=1 cellPadding=4 width="50%" border=1> <TBODY> <TR> <TD align=middle width="40%" bgColor=#003366><B><FONT color=#ffffff>Question</FONT></B></TD> <TD align=middle width="20%" bgColor=#003366><B><FONT color=#ffffff>No Reply</FONT></B></TD> <TD align=middle width="40%" bgColor=#003366 colSpan=5><B><FONT color=#ffffff>Reply</FONT></B></TD></TR> <TR bgColor=#dedede width="100%"> <TH align=left>Question1 </TH> <TD align=middle bgColor=gray><INPUT name=reply1 type=radio value=-1> </TD> <TD align=middle><INPUT name=reply1 type=radio value=0>0 </TD> <TD align=middle><INPUT name=reply1 type=radio value=1>1 </TD> <TD align=middle><INPUT type=radio value=2 name=reply1>2 </TD> <TD align=middle><INPUT type=radio value=3 name=reply1>3 </TD> <TD align=middle><INPUT type=radio value=4 name=reply1>4 </TD></TR> <TR bgColor=#efefef width="100%"> <TH align=left>Question2 </TH> <TD align=middle bgColor=gray><INPUT type=radio value=-1 name=reply2> </TD> <TD align=middle><INPUT type=radio value=0 name=reply2>0 </TD> <TD align=middle><INPUT type=radio value=1 name=reply2>1 </TD> <TD align=middle><INPUT type=radio value=2 name=reply2>2 </TD> <TD align=middle><INPUT type=radio value=3 name=reply2>3 </TD> <TD align=middle><INPUT type=radio value=4 name=reply2>4 </TD></TR> <TR bgColor=#dedede width="100%"> <TH align=left>Question3 </TH> <TD align=middle bgColor=gray><INPUT type=radio value=-1 name=reply3> </TD> <TD align=middle><INPUT type=radio value=0 name=reply3>0 </TD> <TD align=middle><INPUT type=radio value=1 name=reply3>1 </TD> <TD align=middle><INPUT type=radio value=2 name=reply3>2 </TD> <TD align=middle><INPUT type=radio value=3 name=reply3>3 </TD> <TD align=middle><INPUT type=radio value=4 name=reply3>4 </TD></TR></TBODY></TABLE></FORM></BODY></HTML> Be aware of word wrapping when copying and pasting, I hope this is what you are looking for and don't hesitate to request for any clarification. Regards.

linuxgeek-ga at Google Answers Visit the source

Was this solution helpful to you?

Related Q & A:

Just Added Q & A:

Find solution

For every problem there is a solution! Proved by Solucija.

  • Got an issue and looking for advice?

  • Ask Solucija to search every corner of the Web for help.

  • Get workable solutions and helpful tips in a moment.

Just ask Solucija about an issue you face and immediately get a list of ready solutions, answers and tips from other Internet users. We always provide the most suitable and complete answer to your question at the top, along with a few good alternatives below.