kdwood
asked on
Javascript Virtual Keyboard
Greetings Gurus, I have a question regarding a Javascript virtual keyboard.
Is it possible to write a virtual keyboard in Javascript that will behave like a hardware keyboard. Let me clarify, I have seen a lot of Javascript examples where the output of the Virtual keyboard was linked to specific text fields or text areas. However, I would like this Virtual keyboard to be in the web page footer and I would simply like it to fill in whatever text input field has focus, just like a hardware keyboard would behave on any given web page.
So imagine a web application that has a persistent footer, with this JavaScript keyboard showing, but as you navigate to different pages and the body content changes, the virtual keyboard would be smart enough to fill in whatever input fields are selected as you click on the keyboard buttons.
Thank you in advance for your help.
Regards,
Keith
Is it possible to write a virtual keyboard in Javascript that will behave like a hardware keyboard. Let me clarify, I have seen a lot of Javascript examples where the output of the Virtual keyboard was linked to specific text fields or text areas. However, I would like this Virtual keyboard to be in the web page footer and I would simply like it to fill in whatever text input field has focus, just like a hardware keyboard would behave on any given web page.
So imagine a web application that has a persistent footer, with this JavaScript keyboard showing, but as you navigate to different pages and the body content changes, the virtual keyboard would be smart enough to fill in whatever input fields are selected as you click on the keyboard buttons.
Thank you in advance for your help.
Regards,
Keith
ASKER
Greetings Orgrima and thanks for the quick response.
The problem that I have, which I should have stated in my post, was that I do not have access to the "input elements" in the body content. This is a third party web based application that is basically a "screen scraper" for our iSeries(AS/400) applications.
The application renders the content of the screen on the fly and I do not have access to any of the backend code.
However, I do have access to the Header.html and Footer.HTML files. My hope was to embed the virtual keyboard into the footer and simulate a hardware keypress into the current input field, without having to code anything on the individual input fields themselves.
Hope that makes sense.
Regards,
Keith
The problem that I have, which I should have stated in my post, was that I do not have access to the "input elements" in the body content. This is a third party web based application that is basically a "screen scraper" for our iSeries(AS/400) applications.
The application renders the content of the screen on the fly and I do not have access to any of the backend code.
However, I do have access to the Header.html and Footer.HTML files. My hope was to embed the virtual keyboard into the footer and simulate a hardware keypress into the current input field, without having to code anything on the individual input fields themselves.
Hope that makes sense.
Regards,
Keith
Hi,
The footer file will do it. You can access the document.form element from the body above. If they are in a frameset, use parrent.aboveframe.documen t.form.
Try it!
The footer file will do it. You can access the document.form element from the body above. If they are in a frameset, use parrent.aboveframe.documen
Try it!
ASKER
Greetings gurvinder,
Yes I did look at those solutions and unfortunately they all require the developer to modify the input elements that will receive input from the keyboard. As I stated above, I do not have access to the backend code of the rendered content. I only have access to the Footer and Header of the web page.
Thanks for the reply,
Keith
Yes I did look at those solutions and unfortunately they all require the developer to modify the input elements that will receive input from the keyboard. As I stated above, I do not have access to the backend code of the rendered content. I only have access to the Footer and Header of the web page.
Thanks for the reply,
Keith
ASKER
Ok Orgrim,
I will give it a try.
Thanks again,
Keith
I will give it a try.
Thanks again,
Keith
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thank you for your help!
Add code to every input fields
<script>
var strFieldNameInput = '';
</script>
<INPUT class=forminput type=password size=25 name=PassWord onfocus="strFieldNameInput
Keyboard (from http://www.javascriptbank.com/virtual-keyboard-tool.html/en/)
<IMG height=156 alt=""
src="keyboard.gif" width=450 useMap=#key>
<BR><BR><MAP name=key><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=119,123,292,146><AR
onclick="document.LOGIN.Pa
shape=RECT coords=7,5,32,29><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=37,4,60,26><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=65,4,89,28><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=96,3,117,28><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=125,5,147,27><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=155,5,176,28><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=183,4,205,27><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=212,5,235,27><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=241,6,263,28><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=271,6,292,30><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=298,4,324,30><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=334,92,361,118><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=306,92,331,114><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=276,93,300,115><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=246,93,271,115><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=219,91,245,115><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=190,91,214,115><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=159,93,186,115><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=130,95,153,118><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=101,90,127,117><ARE
onclick="document.LOGIN.Pa
shape=RECT coords=74,92,96,115><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=351,61,376,88><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=321,63,348,86><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=293,64,315,87><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=263,63,286,87><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=234,62,258,85><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=206,64,229,87><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=178,64,200,87><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=148,63,170,86><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=118,64,142,89><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=90,64,112,87><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=60,64,84,86><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=371,34,397,58><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=343,35,368,59><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=315,33,339,58><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=285,35,310,60><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=255,34,280,57><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=229,34,251,57><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=198,35,222,58><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=169,34,193,57><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=140,33,165,58><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=110,35,134,57><AREA
onclick="document.LOGIN.Pa
shape=RECT coords=82,36,103,57><AREA
onclick="document.LOGIN.Pa
shape=RECT
coords=51,35,73,58></MAP>
now change this code to use an eval statement instead of directly binding the keyboard to one field
onclick="document.LOGIN.Pa
becomes
onclick=eval("document.LOG
Enjoy