# Use virtual keyboard in node-red-dashboard
**URL:** https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420
**Category:** Dashboard
**Created:** [20 August 2018 15:13 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420 "2018-08-20T15:13:24Z")
**Posts on this page:** 20
**Page:** 2
### Author:  [@krzydec](https://discourse.nodered.org/u/krzydec)
#### Post date: [20 December 2018 23:33 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/21 "2018-12-20T23:33:20Z")
Hello
I think you are right. I managed to change the layout to "numbers only" and I figured out how to change the position (in "Z" plane). I'm almost certain that the issue is related to the position and the size of the keyboard.
Any tips what I should do to change the size?
I also want to change the Enter button functionality and label. I want this button to close Keyboard and change label to "BACK"
Thank you for your help.
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [21 December 2018 00:32 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/22 "2018-12-21T00:32:41Z")
To change the size look for css width and height. I don't think its causing the flicker though.
To close the keyboard, you could change the ENTER button to display BACK and change the beahavior to: modal.style.display = "none", but there should be no need to, as you can close the keyboard by either clicking the X button in the top right corner or by clicking anywhere on the dimmed dashboard outside the keyboard box.
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [21 December 2018 16:31 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/23 "2018-12-21T16:31:41Z")
I've updated the flow so that the keyboard should always be centered, no matter your screen resolution or browser window size.
---
### Author:  [@krzydec](https://discourse.nodered.org/u/krzydec)
#### Post date: [21 December 2018 23:40 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/24 "2018-12-21T23:40:55Z")
Hello
Thank you very much for your help.
Thanks to your tips I was able to modify the keyboard, and it is working for me now.
I know now how to change the position, layout, colour and size of the keyboard.
There is one last thing that bothers me, which is a grey area outside the keyboard (I'm referring to the box outside the keyboard that you can click on to close it). How I can resize it.
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [22 December 2018 00:30 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/25 "2018-12-22T00:30:14Z")
This grey area is called modal ( compared to modal-content for the actual keyboard area) and is supposed to be full-screen ( width: 100%, height 100%). If you want tou can set the modal-content's position to absolute instead of relative so that changing one will not impact the other.
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [22 December 2018 06:37 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/26 "2018-12-22T06:37:08Z")
I just updated the flow to automatically detect the input type (number or text) in order to display the right keyboard layout.
---
### Author:  [@krzydec](https://discourse.nodered.org/u/krzydec)
#### Post date: [28 December 2018 22:10 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/27 "2018-12-28T22:10:20Z")
Hello.
Thank you for your support. I appreciate your help.
I was able to modify the keyboard to my needs and it's working on the 7" touchscreen now.
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [28 December 2018 22:30 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/28 "2018-12-28T22:30:59Z")
My pleasure! I'm glad you got it working to your liking.
---
### Author:  [@dceejay](https://discourse.nodered.org/u/dceejay)
#### Post date: [28 December 2018 23:37 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/29 "2018-12-28T23:37:14Z")
What is the best way to capture this for next time ? [flows.nodered.org](http://flows.nodered.org) or...?
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [28 December 2018 23:57 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/30 "2018-12-28T23:57:17Z")
Right now it is updated on [https://flows.nodered.org/flow/7fb5bc5ae66e6bc1b1c1b8e800bdef51](https://flows.nodered.org/flow/7fb5bc5ae66e6bc1b1c1b8e800bdef51) the link to it could be marked as solution so that others can try it before trying to piece it together from code snippets scattered in the thread. If there is enough demand, it could be made into a contrib-ui node.
---
### Author:  [@BartButenaers](https://discourse.nodered.org/u/BartButenaers)
#### Post date: [29 December 2018 12:28 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/31 "2018-12-29T12:28:03Z")
> [@hugobox](#):
>
> If there is enough demand, it could be made into a contrib-ui node.
Hey @hugobox, I think this might an interesting use case for a custom ui node... Especially if you would have some settings on the config screen, so users could customize it. Let us know if you need any support, if you ever would consider building it!
Bart
---
### Author:  [@Tobi](https://discourse.nodered.org/u/Tobi)
#### Post date: [4 January 2019 13:21 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/32 "2019-01-04T13:21:58Z")
I have imported your flow, but no keyboard opens, or is it intentional that no laptop will appear on the laptop. No matter if I turn the keyboard on or off with the button
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [4 January 2019 19:01 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/33 "2019-01-04T19:01:56Z")
Hi @Tobi! The virtual keyboard only opens when you click in a text field, if that doesn't work, please state your version of node-red and dashboard, and which browser (and version) you are using.
---
### Author:  [@Tobi](https://discourse.nodered.org/u/Tobi)
#### Post date: [7 January 2019 06:44 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/34 "2019-01-07T06:44:23Z")
I use node-red version v.0.19.5 and dashboard v2.12.2
the browser is firefox 60.4.0esr (64-Bit)
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [7 January 2019 13:34 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/35 "2019-01-07T13:34:56Z")
Do you see any error in the browser console? Does it work in chrome? Is your text field in a ui-text or ui-template node?
---
### Author:  [@Tobi](https://discourse.nodered.org/u/Tobi)
#### Post date: [7 January 2019 13:40 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/36 "2019-01-07T13:40:03Z")
In the browser console the following error appear:
ReferenceError: event is not defined[Weitere Informationen]
In microsoft edge and chrome it works
---
### Author:  [@hugobox](https://discourse.nodered.org/u/hugobox)
#### Post date: [7 January 2019 15:06 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/37 "2019-01-07T15:06:07Z")
Ok I tried with Firefox 64.0 and the keyboard appears without error. Hopefully fixes it for you as well.
---
### Author:  [@stfndr](https://discourse.nodered.org/u/stfndr)
#### Post date: [3 May 2019 10:32 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/38 "2019-05-03T10:32:59Z")
Hello to the all community, this is my first post 🙂
Dear hugobox thanks for your support
I have some trouble with your example flow ([https://flows.nodered.org/flow/7fb5bc5ae66e6bc1b1c1b8e800bdef51](https://flows.nodered.org/flow/7fb5bc5ae66e6bc1b1c1b8e800bdef51)).
I've imported your flow, but It seems not working properly. There any action when I click on the keyboard on/off button. What do you suggest to do?
Could you please check if the example flow is correct? (maybe new version)
Thanks a lot!
---
### Author:  [@Mvogel](https://discourse.nodered.org/u/Mvogel)
#### Post date: [4 May 2019 12:04 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/39 "2019-05-04T12:04:45Z")
I set up my Rpi touchscreen terminal to boot into Chromium in kiosk mode with NR dashboard as home. I installed 'virtual keyboard' chromium extension which pops up whenever input field is in focus on the dashboard. This solution works quite well.
> **[Virtual Keyboard](https://chrome.google.com/webstore/detail/virtual-keyboard/pflmllfnnabikmfkkaddkoolinlfninn)**
>
> Fullscreen on-screen virtual keyboard for touch screen devices
---
### Author:  [@blackwellj](https://discourse.nodered.org/u/blackwellj)
#### Post date: [11 June 2019 11:02 UTC](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420/40 "2019-06-11T11:02:35Z")
Hi, How can i use this not using the dashboard nodes?
[Previous page](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420.md?page=1)
[Next page](https://discourse.nodered.org/t/use-virtual-keyboard-in-node-red-dashboard/2420.md?page=3)