Home > Forum > Tips&Tricks > How-to set inputmode=none; for an attribute?

How-to set inputmode=none; for an attribute?
0

Hello,
I am working on application that have some fileds, that will be always filled with SCAN of QR Code or just BARCODE scanner. The user will never try to fill that attribute with keyboard on the tablet.
So I would like to have virtual keyboard always hidden for those fields. How to achive this?
I do not have option type "none" in the Studio.
I am currently using BPS 2023.

In reply to: Krystian Golik

Hi, if the user will never fill in this field manually and it will always be handled automatically by an action/rule, you can set the field to read-only mode (cannot be modified execpt by JavaScript).

The user will fill it by using Barcode scanner, not keyboard. So it can not be the readonly.
Usecase:
1. Form is opened
2. JS sets the focus on the attributes, that needs to be filled with scanner
3. User useses scanner to fill attributes with numbers

There is no need to open keyboard that takes half of the screen if the user will never use this keyboard on this form.

MVP
In reply to: Jarosław Dziekan

The user will fill it by using Barcode scanner, not keyboard. So it can not be the readonly.
Usecase:
1. Form is opened
2. JS sets the focus on the attributes, that needs to be filled with scanner
3. User useses scanner to fill attributes with numbers

There is no need to open keyboard that takes half of the screen if the user will never use this keyboard on this form.

Hi,
you can try adding a html type field and create an input type field in it. Then add an action (e.g. onfocusout), and using a javascript function you will enter the value into the webcon field (it can be technical)

e.g. < input type="text" inputmode="none" onfocusout="SetValue('#{FLD:xxx}#', this.value);"/>

xxx - id of your webcon field in which the data will be stored

regards,
Jacek

Please check it

Create form rule and add to compact form behaviour

function waitForElement(selector, callback) {
const interval = setInterval(() => {
const element = document.querySelector(selector);
if (element) {
clearInterval(interval);
callback(element);
}
}, 100); // Check every 100 milliseconds for an input
}

// #{FLD:1029}# this is webcon variable of the field with id = 1029
waitForElement("##{FLD:1029}# input", (element) => {
// Change input mode when the element is available
element.setAttribute("inputmode", "none");
});