Sherzod Posted October 2, 2013 Share Posted October 2, 2013 JavaScript Graphical / Virtual Keyboard Interface. http://www.greywyvern.com/code/javascript/keyboard how to use? Download the following files: 1. http://www.greywyvern.com/code/javascript/keyboard.js 2. http://www.greywyvern.com/code/javascript/keyboard.css 3. http://www.greywyvern.com/code/javascript/keyboard.png 4. UniServerModule CustomFiles Add files/keyboard.js files/keyboard.css 5. Keyboard.png I added to the root directory... 6. Add to form UniEdit1. 7. UniEdit1.ClientEvents.ExtEvents.OnAfterrender function OnAfterrender(cmp) { // focus on field Ext.QuickTips.init(); Ext.defer(function () { cmp.inputEl.dom.focus(); }, 100); // listen virtual keyboard keys cmp.inputEl.on({ mousedown: function (ev) { if (ev.target.tagName === 'TD') { // We trigger change event only on textfield with the focus if (document.activeElement) { if (document.activeElement.id === cmp.inputEl.dom.id) cmp.fireEvent('change'); } } }, delegate: '#keyboardInputMaster' }); cmp.inputEl.dom.style.width = "75%"; VKI_attach(cmp.inputEl.dom); } Sincerely... 5 Quote Link to comment Share on other sites More sharing options...
Sherzod Posted October 4, 2013 Author Share Posted October 4, 2013 Hi All! In my opinion another good Virtual Keyboard, just need to find out how to include to the project: http://mottie.github.io/Keyboard/ Best regards... 1 Quote Link to comment Share on other sites More sharing options...
dionel1969 Posted October 8, 2013 Share Posted October 8, 2013 Very good. The keyboards from github look good. Quote Link to comment Share on other sites More sharing options...
Ario.Paxaz Posted August 3, 2017 Share Posted August 3, 2017 7. UniEdit1.ClientEvents.ExtEvents.OnAfterrender Hi OnAfterrender like this now. function afterrender(sender, eOpts) What is must be change for use it? Best Regards. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted August 3, 2017 Author Share Posted August 3, 2017 Hi, Hi OnAfterrender like this now. function afterrender(sender, eOpts) What is must be change for use it? Best Regards. Like this: function afterrender(sender, eOpts) { var cmp = sender; // focus on field Ext.QuickTips.init(); Ext.defer(function () { cmp.inputEl.dom.focus(); cmp.inputEl.dom.style.width = "70%"; }, 100); // listen virtual keyboard keys cmp.inputEl.on({ mousedown: function (ev) { if (ev.target.tagName === 'TD') { // We trigger change event only on textfield with the focus if (document.activeElement) { if (document.activeElement.id === cmp.inputEl.dom.id) cmp.fireEvent('change'); } } }, delegate: '#keyboardInputMaster' }); VKI_attach(cmp.inputEl.dom); } Best regards, Quote Link to comment Share on other sites More sharing options...
GerhardV Posted August 3, 2017 Share Posted August 3, 2017 Thank you mate! Quote Link to comment Share on other sites More sharing options...
Ario.Paxaz Posted August 3, 2017 Share Posted August 3, 2017 Hi Thank you very much. Quote Link to comment Share on other sites More sharing options...
Ario.Paxaz Posted August 3, 2017 Share Posted August 3, 2017 Hi How to can use keyboard with accident character? and who to move Keyboard.png from root directory to the files directory? Best Regards. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted August 3, 2017 Author Share Posted August 3, 2017 and who to move Keyboard.png from root directory to the files directory? VKI_imageURI = "files/keyboard.png"; function afterrender(sender, eOpts) { var cmp = sender; // focus on field Ext.QuickTips.init(); Ext.defer(function () { cmp.inputEl.dom.focus(); cmp.inputEl.dom.style.width = "70%"; }, 100); // listen virtual keyboard keys cmp.inputEl.on({ mousedown: function (ev) { if (ev.target.tagName === 'TD') { // We trigger change event only on textfield with the focus if (document.activeElement) { if (document.activeElement.id === cmp.inputEl.dom.id) cmp.fireEvent('change'); } } }, delegate: '#keyboardInputMaster' }); VKI_imageURI = "files/keyboard.png"; // <--------------------------- VKI_attach(cmp.inputEl.dom); } Quote Link to comment Share on other sites More sharing options...
Ario.Paxaz Posted August 3, 2017 Share Posted August 3, 2017 Hi Thank you for rapid answer. And How to can use keyboard with accident character? Best Regards. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted August 3, 2017 Author Share Posted August 3, 2017 Sorry what is it? Quote Link to comment Share on other sites More sharing options...
Ario.Paxaz Posted August 3, 2017 Share Posted August 3, 2017 Hi The character position have been replaced in any show. for (a) position (d) showed,and in (d) position another character showed. and in next time, all character position change. Best Regards. Quote Link to comment Share on other sites More sharing options...
GerhardV Posted August 3, 2017 Share Posted August 3, 2017 Not sure what an "accident character" is but maybe there is a setting for language/region? Quote Link to comment Share on other sites More sharing options...
Sherzod Posted August 3, 2017 Author Share Posted August 3, 2017 Not sure what an "accident character" is but maybe there is a setting for language/region? Default keyboard layout: To change the default keyboard which displays first for each different page, change the value of the this.VKI_kt variable to the name of the keyboard. For example, to make the default keyboard "French", change the value like so: this.VKI_kt = "French";. Or: VKI_attach(cmp.inputEl.dom); cmp.inputEl.dom.setAttribute("lang", "fr"); 1 Quote Link to comment Share on other sites More sharing options...
Ario.Paxaz Posted May 26, 2018 Share Posted May 26, 2018 Hi In 1461 version don't showed virtual keyboard. Best Regards. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted May 26, 2018 Author Share Posted May 26, 2018 Hi, We will check it Quote Link to comment Share on other sites More sharing options...
Sherzod Posted May 26, 2018 Author Share Posted May 26, 2018 Hi, Can you try this?: function afterrender(sender, eOpts) { // focus on field var cmp = sender; Ext.QuickTips.init(); Ext.defer(function() { cmp.inputEl.dom.focus(); }, 100); // listen virtual keyboard keys cmp.inputEl.on({ mousedown: function(ev) { if (ev.target.tagName === 'TD') { // We trigger change event only on textfield with the focus if (document.activeElement) { if (document.activeElement.id === cmp.inputEl.dom.id) cmp.fireEvent('change'); } } }, delegate: '#keyboardInputMaster' }); VKI_attach(cmp.bodyEl.dom); } Quote Link to comment Share on other sites More sharing options...
Ario.Paxaz Posted May 27, 2018 Share Posted May 27, 2018 Hi It's displayed.but how to can manipulate it's with. Best Regards. Quote Link to comment Share on other sites More sharing options...
Sherzod Posted May 27, 2018 Author Share Posted May 27, 2018 Hi, Hi It's displayed.but how to can manipulate it's with. Best Regards. Yes sorry, Try this: function afterrender(sender, eOpts) { // focus on field var cmp = sender; Ext.QuickTips.init(); Ext.defer(function() { cmp.inputEl.dom.focus(); cmp.inputEl.dom.style.width = "70%"; }, 100); // listen virtual keyboard keys cmp.inputEl.on({ mousedown: function(ev) { if (ev.target.tagName === 'TD') { // We trigger change event only on textfield with the focus if (document.activeElement) { if (document.activeElement.id === cmp.inputEl.dom.id) cmp.fireEvent('change'); } } }, delegate: '#keyboardInputMaster' }); VKI_attach(sender.inputEl.dom); var vkb = cmp.el.query('.keyboardInputInitiator')[0]; if (vkb) { vkb.style.position = 'absolute'; if (cmp.rtl) { vkb.style.left = '0px' } else { vkb.style.right = '0px' } vkb.style.top = '0px'; vkb.style.padding = '3px 1px'; } } Quote Link to comment Share on other sites More sharing options...
Ario.Paxaz Posted May 28, 2018 Share Posted May 28, 2018 Yes sorry, Try this: Hi Thanks. Quote Link to comment Share on other sites More sharing options...
herculanojs Posted June 28, 2018 Share Posted June 28, 2018 Is it possible through an external button to the example (TUniedit) to call the virtual keyboard informing the control that it will be managing? Quote Link to comment Share on other sites More sharing options...
AdilsonReis Posted November 21, 2018 Share Posted November 21, 2018 On 10/4/2013 at 1:27 AM, Sherzod said: Hi All! In my opinion another good Virtual Keyboard, just need to find out how to include to the project: http://mottie.github.io/Keyboard/ how can I use it in Edit TOUCH? Best regards... Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.