Large

Virtual Keyboard Interface

By GreyWyvern Last update Nov 8, 2011 — Installed 49,599 times.

showing the keyboard on page load / document ready

in
Subscribe to showing the keyboard on page load / document ready 9 posts, 2 voices



Luís Rico User

Is there any way of showing the keyboard on page load / document ready? I've been spending some time trying but with no success! is there a way of doing it?

Thanks

 
GreyWyvern Script's Author

Hi Luís,

This depends on whether you are using the userscript version or the static version. Making the userscript version appear on page load doesn't make a lot of sense, so you are probably using the static version, correct?

You can do this by executing the onclick() method of the little keyboard icon that the script places next to each activated input field. You'll need to add another onload event listener to the window which comes after the keyboard.js script in source code order.

window.onload = function() {
  // nextSibling means the element after the input
  document.getElementById('myInput').nextSibling.onclick();
}

Where myInput is the id of the input element for which you want the keyboard to appear right away.

Doing the same for the userscript version is similar but you would have to build a dblclick event and trigger it on the input, since it uses (more complicated) DOM event listeners.

Hope that helps!

 
Luís Rico User

Thanks for the kick reply Grey!
I will give it a try... right now

 
Luís Rico User

Thanks again Grey! It works perfect on FF.
However in IE

document.getElementById('myInput').nextSibling.onclick()

seams to be undefined!

Trying to figure it out! but again no success! No debugger for that! :(
Any ideas?

 
Luís Rico User

Ok, "IE" strikes back on me...(again and again)

Got the keyboard working in IE, with a little workaround... putting the code at the end of VKI_buildKeyboardInputs but now, when page loads, it appears at the bottom of the page... on the same vertical line of the start of input field! :(
When I click the image it shows right positioned!

My guess is something to do with css position attribute! :( I'm looking at css or VKI_position... any ideas? am I in the right way?

Thanks

 
GreyWyvern Script's Author

Hi Luís,
You can't just "open" the keyboard. It needs to be opened as a click associated with an input element. That way, the context of the event allows it to use the input's location on the page to decide where to place the keyboard.

IE should support the nextSibling.onclick() method. However, you need to make sure that it is executed once the page has completely loaded, and after the keyboard.js script. You can ensure this by also adding a timeout:

window.onload = function() {
  setTimeout(function() {
    document.getElementById('myInput').nextSibling.onclick();
  }, 100);
}

This will delay the execution of the onclick call until 100ms after the page has loaded, giving the keyboard script plenty of time to work unimpeded (since it also starts onload). It will remove the possibility of the onclick() call happening before the keyboard image is applied to all inputs.

 
Luís Rico User

Thanks again Grey!

Yesterday night I got it working with my workaround... I had notice that IE need all the elements in the page to position correctly the keyboard.
But your timeout function seams a far more correct way of doing that... I will give it try!

For you info, I want to do a login page w/ password field, and your keyboard has a great funcionallity compared to others... and I allready adapted it to my needs! One last to do thing is to hide the the image. :) I will give it a try this weekend. Report to you after my tests.

Have a great weekend! :)

 
Luís Rico User

Hi Grey!
Thanks for all! Your keyboard is great and fit all my needs.
I had the time out, removed the picture and then put the focus on right place.

Many thanks again!

 
GreyWyvern Script's Author

Glad to hear it :)

Cheers!

Cross
Presentational HTML allowed.
Use <code> for inline code and <pre> for code blocks. Use &lt; and &gt; for literal < and >.
We help break paragraphs and link your links.
or cancel