React Application- Suppress the Virtual Keyboard when Barcode Scanner Text box Active/ Focused (Tablet)

Question

Good Evening

when we scan bar codes from our application, sometimes when we hit the confirm button, the virtual key board pops up (Tablet - Android Device), which it should not because at that time all scannable fields are completed and we are only trying to save .

We would like to suppress the pop up of virtual keyboard.

We have active /Focused Text box - When Scanning is completed , We click Save Save - Will call some api (Backend Process) and when save is successful it will return next set off Task to the Front End. In this action , getting the virtual Keyboard - Which we should suppress Could you please help

When the page is loaded, Focus is set to Barcode Scanner text control , We dont get any virtual Keyboard on page loading but we do get when the record is saved and other setup task is pushed from Backend to FrontEnd

I tried like , barcodeRef.current.focus() or barcodeRef.current.blur()

after Blur event when i tried to focus the text box i am getting the virtual Keyboard .

How do i resolve the issue - Could you please help

Answer 1

I used the following code to suppress the Keyboard issue. setReadOnly(true);

barcodeRef.current.removeAttribute('autofocus');

setReadOnly(true);

setReadOnly(false);

// Focus on the input field

barcodeRef.current.setAttribute('autofocus', 'true');

barcodeRef.current.setAttribute('inputmode', 'none');

barcodeRef.current.focus();