I'm using a virtual keyboard. I have a checkbox that controls whether the virtual keyboard is displayed or not. The thing is that I don't understand how to disable it. I try to unbind it but it doesn't work...
I also tried to use namespaces and then unbind all namespaces but still the keyboard remains accessible after a click on the text box.
<input class="virtualKeyboardField ui-keyboard-input ui-widget-content ui-corner-all" data-val="true" data-val-required="The User name field is required." id="loginUserName" name="UserName" type="text" value="" aria-haspopup="true" role="textbox">
<script type="text/javascript">
$(function () {
//show login
$("#showLogin").on({
click: function () {
$("#loginFormDiv").toggle("slow");
}
});
$("#cb_showVKey").on('click', CheckIsToShowKey);
});
function CheckIsToShowKey(event) {
//var isCheck = $("#cb_showVKey").is(':checked');
//alert("ischecked? " + isCheck);
if ($("#cb_showVKey").is(':checked')) {
//if checked
BindKeyboards();
} else {
//not checked
UnBindKeyboards();
}
}
function bindVirtualKeyboards() {
$("#loginForm").delegate(".virtualKeyboardField", "click.xpto", BindKeyboards);
}
function UnBindKeyboards() {
$("#loginForm").undelegate(".virtualKeyboardField", "click.xpto", BindKeyboards);
}
function BindKeyboards() {
// alert(event.currentTarget.id);
//alert("xpto");
if ($("#cb_showVKey").is(':checked')) {
$("#loginUserName").keyboard({
layout: 'qwerty',
lockInput: true,
preventPaste: true
});
$("#loginUserPassword").keyboard({
layout: 'qwerty',
lockInput: true,
preventPaste: true
});
}
}
$(document).ready(function () {
$("#loginForm").validate();
BindKeyboards();
});
</script>
Any help guys?
That does what you need
var keys;
var key_init=function() {keys=$('#keyboard').keyboard().getkeyboard();};
key_init();
$('#switch_kbd').change(
function() {
if ($(this).attr('checked')==='checked') { key_init(); return;}
keys.destroy();
}
);
sample
I updated it's wiki, and also noted that it was pointed to layout demo which uses same solution.
from their docs:
keyboard is the keyboard data object which you can also access using $('#keyboard').getkeyboard()
Use keyboard.destroy()
- This function completely removes the keyboard and events from the input.
- This function is needed if you plan to change the keyboard layout when using the same input. See the layout demo.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With