---
metadata:
  - name: generator
    content: Diplodoc Platform v5.54.5
alternate:
  - https://divkit.tech/docs/en/concepts/input.md
  - https://divkit.tech/docs/ru/concepts/input.md
  - href: en/concepts/input.md
    type: text/markdown
    title: Markdown version
  - href: ../llms.txt
    type: text/markdown
    title: llms.txt
---
> **Documentation Index:** Fetch the complete configuration index at https://divkit.tech/docs/en/llms.txt

# Input field {#input}

The [input](https://divkit.tech/docs/en/concepts/divs/2/div-input.md) element is a field for entering text. It has the same properties as the [text](https://divkit.tech/docs/en/concepts/divs/2/div-text.md) element, as well as several additional properties:

- `hint_text`: Hint text to display in an empty input field.
- `hint_color`: Hint color.
- `highlight_color`: Text highlight color. If the value isn't set, the color set in the client will be used instead.
- `native_interface`: Object. It contains a single `color` field, which specifies the color of the input field underline.
- `keyboard_type`: Type of keyboard. The following types are supported (default: `multi_line_text`):
  - `single_line_text`
  - `multi_line_text`
  - `phone`
  - `number`
  - `email`
  - `uri`
  - `password`
- `select_all_on_focus`: Highlight input text when focused.
- `mask`: [Mask](#mask) for enforcing a specific text input pattern.
- `validators`: [Validator](#validator) that checks whether the field value meets the specified conditions.

## Mask {#mask}

**Text with a fixed number of characters**

To set it up, use the following fields:

- `always_visible`: Display the mask when the input field is empty.
- `raw_text_variable`: Variable that stores raw user input.
- `pattern`: String specifying the text input format. For example, for a phone number, you can use the pattern `+7 (###) ###-##-## `.
- `pattern_elements`: Array defining the characters that can be substituted with user input.
  - `key`: Array element to substitute with user input. In the example with the phone number, you need to replace the `#` characters.
  - `placeholder`: Character or string to display in an empty input field.
  - `regex`: Regular expression used to validate input characters.

For a detailed description of parameters for masks with a fixed number of characters, see the element [reference](https://divkit.tech/docs/en/concepts/divs/2/div-fixed-length-input-mask.md).

{% cut "Sample code" %}

```json translate=no
"mask": {
    "type": "fixed_length",
    "pattern": ...,
    "raw_text_variable": ...,
    "pattern_elements": [
        {
            "key": ... ,
            "regex": ... ,
            "placeholder": ...
        }
    ],
    "always_visible": ...
}
```

{% endcut %}

**Currency values in a predefined regional format**

To set it up, use the following fields:

- `raw_text_variable`: Variable that stores raw user input.
- `locale`: [IETF BCP 47](https://en.wikipedia.org/wiki/IETF_language_tag) language tag that the currency format must match. If no locale is specified, the system will detect it automatically.

The mask automatically formats input values according to regional settings, supports entering numbers with up to two decimal places, and validates input against a pattern.

For a detailed description of parameters for currency value masks, see the element [reference](https://divkit.tech/docs/en/concepts/divs/2/div-currency-input-mask.md).

{% cut "Sample code" %}

```json translate=no
"mask": {
    "type": "currency",
    "raw_text_variable": ... ,
    "locale": ...
}
```

{% endcut %}

**Phone numbers with dynamic regional format recognition**

To set it up, use the following fields:

- `always_visible`: Display the mask when the input field is empty.
- `raw_text_variable`: Variable that stores raw user input.

For a detailed description of parameters for phone number masks, see the element [reference](https://divkit.tech/docs/en/concepts/divs/2/div-phone-input-mask.md).

{% cut "Sample code" %}

```json translate=no
"mask": {
    "type": "phone",
    "raw_text_variable": ...,
    "always_visible": ...
}
```

{% endcut %}

## Keyboard behavior {#keyboard}

Tapping outside an input field while the keyboard is open will dismiss the keyboard.

## Cursor control {#cursor-control}

To control the cursor position in a text field, you can use the `set_cursor_position` action. This action allows you to programmatically set the cursor to a specific position or select a text range.

**Action parameters:**
- `start` — starting cursor position (0 for the beginning of text, -1 for the end of text)
- `end` — ending position for selecting a range (optional)

**Features:**
- Supports working with masked input fields
- Allows precise cursor positioning in formatted text
- Works on all platforms (Android, iOS, Web)

{% cut "Sample usage of set_cursor_position action" %}

```json translate=no
{
    "type": "set_cursor_position",
    "start": 0,
    "end": 4
}
```

In this example, the action will select the first 4 characters in the text field.

{% endcut %}

## Validators {#validator}

**Based on regular expressions**

To set it up, use the following fields:

- `pattern`: Regular expression that the field value must match.
- `allow_empty`: Determines whether an empty field can be considered valid.
- `label_id`: ID of a text element containing the error message. This ID is also used for accessibility support.
- `variable`: Name of the variable that stores the result of the expression.

For a detailed description of parameters for validators based on regular expressions, see the element [reference](https://divkit.tech/docs/en/concepts/divs/2/div-input-validator-regex.md).

{% cut "Sample code" %}

```json translate=no
{
    "type": "regex",
    "pattern": "^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\\.[a-zA-Z]{2,}$",
    "allow_empty": false,
    "label_id": "email_validation_error",
    "variable": "email_input"
}
```

{% endcut %}

**Based on DivKit calculated expressions**

To set it up, use the following fields:

- `pattern`: [Calculated expression](https://divkit.tech/docs/en/concepts/expressions.md) used to validate the value of a field.
- `allow_empty`: Determines whether an empty field can be considered valid.
- `label_id`: ID of a text element containing the error message. This ID is also used for accessibility support.
- `variable`: Name of the variable that stores the result of the expression.

For a detailed description of parameters for validators based on calculated expressions, see the element [reference](https://divkit.tech/docs/en/concepts/divs/2/div-input-validator-expression.md).

{% cut "Sample code" %}

```json translate=no
"validators": [
    {
        "type": "expression",
        "condition": ...,
        "allow_empty": ...,
        "label_id": ...,
        "variable": ...
    }
]
```

{% endcut %}

<!-- source: en/_includes/index/troubleshooting.md -->
## Learn more {#troubleshooting}

You can discuss topics of interest in the DivKit user community in Telegram: [https://t.me/divkit_community_en](https://t.me/divkit_community_en).



[DivKit Repository](https://github.com/divkit/divkit)
<!-- endsource: en/_includes/index/troubleshooting.md -->