<!-- https://abap2ui5.github.io/docs/cookbook/browser_interaction/soft_keyboard -->

# Soft Keyboard

## Hide Soft Keyboard

For UI5 input fields, the soft keyboard pops up automatically when an input receives focus. Sometimes — for example, in warehouses with small devices used mainly for barcode scanning — you don't want this behavior.

The `keyboard_set_mode` frontend event sets the HTML `inputmode` attribute on a UI5 input. Pass the control id and the desired mode (`none` hides the soft keyboard; `text`, `numeric`, `decimal`, `tel`, etc. restore it with the matching layout).

```abap
CLASS z2ui5_cl_sample_softkeyb DEFINITION PUBLIC.

  PUBLIC SECTION.
    INTERFACES z2ui5_if_app.

    DATA input TYPE string.

  PROTECTED SECTION.
  PRIVATE SECTION.
ENDCLASS.

CLASS z2ui5_cl_sample_softkeyb IMPLEMENTATION.
  METHOD z2ui5_if_app~main.

    IF client->check_on_navigated( ).

      DATA(view) = z2ui5_cl_ui5_view_builder=>factory(
          )->ele( n = `View` ns = `mvc`
              )->a( n = `xmlns`      v = `sap.m`
              )->a( n = `xmlns:mvc`  v = `sap.ui.core.mvc`
              )->a( n = `xmlns:form` v = `sap.ui.layout.form`

              )->ele( `Shell`
                  )->ele( `Page`
                      )->a( n = `title`          v = `abap2UI5 - Softkeyboard on/off`
                      )->a( n = `navButtonPress` v = client->_event( `BACK` )
                      )->a( n = `showNavButton`  b = client->check_app_prev_stack( )

                      )->ele( n = `SimpleForm` ns = `form`
                          )->a( n = `editable` b = abap_true

                          )->ele( n = `content` ns = `form`
                              )->tag( `Title`
                                  )->a( n = `text` v = `Keyboard on/off`
                              )->tag( `Label`
                                  )->a( n = `text` v = `Input`
                              )->tag( `Input`
                                  )->a( n = `id`               v = `ZINPUT`
                                  )->a( n = `value`            v = client->_bind( input )
                                  )->a( n = `valueHelpRequest` v = client->_event( `CALL_KEYBOARD` )
                                  )->a( n = `showValueHelp`    b = abap_true ).

      client->view_display( view->stringify( ) ).

      RETURN.
    ENDIF.

    CASE client->get( )-event.
      WHEN `CALL_KEYBOARD`.
        client->follow_up_action( val   = client->cs_event-keyboard_set_mode
                        t_arg = VALUE #( ( `ZINPUT` ) ( `none` ) ) ).
      WHEN `BACK`.
        client->nav_app_leave( ).
    ENDCASE.

  ENDMETHOD.
ENDCLASS.
```

To re-enable the keyboard, fire the same event with a different mode (`text`, `numeric`, …).

<!-- samples:start (generated by scripts/link-samples.mjs — do not edit) -->

## Working Samples

Complete apps from the [sample catalog](https://github.com/abap2UI5/samples/blob/main/SAMPLES.md)
that use what this page describes. Each is a single class — pull the repository with
[abapGit](https://abapgit.org) and start it with `?app_start=<class>`.

| Sample | Class |
|---|---|
| Soft Keyboard Mode on Mobile (A) | [`Z2UI5_CL_SMP_APP_352`](https://github.com/abap2UI5/samples/blob/main/src/01/z2ui5_cl_smp_app_352.clas.abap) |

<!-- samples:end -->
