Dynamically value in the data-trigger-keyboard attribute
madhuraadawadkar opened this issue · 2 comments
Is there a way where I can bind the keyboard to a field depending on a boolean value that can change at runtime? Something like watching the value of the data-trigger-keyboard attribute for changes and then enabling/disabling keyboard on a field.
Example, I have a checkbox, whose value will be given to the data-trigger-keyboard attribute on a text field. When user checks the checkbox, then the keyboard should be bound to the text field. When unchecked, the keyboard should be disabled.
This isn't a feature of the keyboard but you can easily handle this on your end. Below is a simple snippet to get you started. This certainly is just a starting point and could be improved or adapted depending on how generic or specific of a solution you'd like. I mixed in some jQuery, but of course this could easily be done with vanilla JavaScript.
<input data-linked-field="keyboard-field-1" type="checkbox">
<input id="keyboard-field-1" data-trigger-keyboard="false" type="text">
<script>
$('input:checkbox').change((event) => {
const {
target
} = event;
const {
checked: isChecked
} = target;
const linkedField = $(target).data('linkedField');
$(`#${linkedField}`).data('triggerKeyboard', isChecked);
});
</script>
Thanks a lot! This worked perfectly!