> For the complete documentation index, see [llms.txt](https://docs.eximee.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.eximee.com/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/1-wprowadzanie-danych-inputs/pole-tekstowe-textfield.md). # Text field - TextField Single-line text input field. ![](/files/a6bed18485bb1ec6825ef75410db694a2a80975d) ✅ **When to use:** * The data fits on one line (e.g. first name, last name, national ID number). :x: **When not to use:** * More than one sentence can be entered (e.g. opinion, justification). **Use**: [TextArea](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/1-wprowadzanie-danych-inputs/obszar-tekstu-textarea.md). * There is the possibility and sense of using a dedicated field (e.g. PIN, phone number, date). **Use**: [PinField](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/1-wprowadzanie-danych-inputs/komponent-pin-pinfield.md), [PhoneInput](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/1-wprowadzanie-danych-inputs/numer-telefonu-phoneinput.md), [DatePicker](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/1-wprowadzanie-danych-inputs/data-datepicker.md). ## Component properties | Eximee Designer property | Attribute name in the Source | Description | | ---------------------------------------------------------------------------------- | --------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | | **Inactive field displayed as a label** (section **Basic properties**) | labelIfDisabled |

If set to true, the inactive component is displayed as bold text, without graying out, borders, or background (on the application it looks like a Label). → demo application: demoLabelIfDisabled

Availability of functionality depends on the license and may not be available in all deployments.

| | **Data type** (section **Data quality**) | expectedType | Definition of the type of data entered (available formats are: STRING, LONG, DOUBLE, URL, EMAIL.) in order to force the mobile channel to display a keyboard matching this type (e.g. to display only the numeric keyboard, we use type LONG). | | **Real-time formatting** (section **Data quality**) | formatterRealTime | Specifies whether formatting should occur after pressing the button on the keyboard, or only after leaving the field. Default value is "false". | | **Validation after each character** (section **Data quality**) | validationOnEverySign | Allows validation (only field requiredness and mask) to be triggered on the component after each entered character. Default component value is 'false'. Availability of the feature depends on the license and may not be available in all deployments. | | **Character counter** (section **Data quality**) | characterCounter | If set to true, a counter showing how many characters have been entered should be displayed under the field. If the field additionally has set **Maximum number of characters**, then this information will also be displayed. Displaying validation errors hides the counter. Availability of the feature depends on the license and may not be available in all deployments. | | **Autocomplete for empty field** (section **Data quality**) | autocompleteForEmptyField | Allows suggestions to be displayed as soon as the text field is entered. Allows selection of one of the options or manual entry of the selection. For the text field that is to display suggestions, check the checkbox **Autocomplete for empty field** from the section **Data quality**. We connect an external data source, as described below in the section **Autocomplete - supplying suggestions.** | | **Minimum number of characters triggering suggestions** (section **Data quality**) | minLengthToAutocomplete |

Minimum number of characters for which the mechanism triggering suggestions (autocompleter) will be launched. Value 0 means no such mechanism.

For the functionality to work properly, the flag autoServerUpdate must be set to "false". Availability of the feature depends on the license and may not be available in all deployments.

| | **Additional option in the list (key)** (section **Data quality**) | autocompleteNoMatchButtonLabelKey | Translation key whose value is displayed in an additional button shown in the autocomplete suggestions list, allowing the client to indicate that they did not find a suitable option in the domain. Clicking the button emits the AUTOCOMPLETE\_NO\_MATCH\_BUTTON\_CLICKED action. Control of the button's visibility is described below in the section **Autocomplete - supplying suggestions**. The availability of this functionality depends on the license and may not be available in all deployments. | | **Filter suggestions list** (section **Data quality**) | autocompleteOptionsFilterEnabled | Flag defining whether, when the autocomplete suggestions list is supplied from a service (EDS), they should be filtered platform-side based on the text entered in the field. Setting it to false allows the entire, case-specific suggestion logic to be contained in the service. When set to false, the value entered by the client is automatically passed to the service supplying suggestions as a parameter with the key `__searchText` (even if we do not define this input parameter for the supplying service), which can be used in the service to implement custom filtering logic. Default value: true. Availability of the feature depends on the license and may not be available in all deployments. | | **Show field clear button** (section **Styling**) | showClearButton |

Flag indicating whether the component should display a button for clearing the field. Default value: false.

Availability of functionality depends on the license and may not be available in all deployments.

| | **Show maximum allowed number of characters** (section **Data quality**) | showMaxLength |

Flag indicating whether the component should display the maximum allowed number of characters.

Availability of functionality depends on the license and may not be available in all deployments.

| | **Maximum number of characters** (section **Data quality**) | maxLength | Definition of the maximum number of characters. | | **Mask** (section **Data quality**) | mask | Mask *REGEX* validating the field. More in [Simple validations](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/praca-z-komponentami-bazowymi/walidacja-wartosci-komponentow/walidacje-proste-wbudowane.md). | | **Mask matching error message** (section **Data quality**) | maskValidationError | Error label for a value that does not match the mask. | | **Mask presentation** (section **Data quality**) | visibleMask |

Allows the template designer to define the format in which data is to be entered into the text field. The mask allows defining specific types of fields using the following characters:

The mask can also include a desired separator, e.g. "-", "/". Sample masks:

More information here: Simple validations

| | **Prefix visibility condition** (section **Data quality**) | prefixVisibleCondition | Specifies whether and when to display the prefix. Availability of the feature depends on the license and may not be available in all deployments. | | **Prefix** (section **Data quality**) | prefix | Text to be displayed in the prefix. | | **Suffix** (section **Data quality**) | suffix | Text to be displayed in the suffix. | | **Placeholder** (section **Data quality**) | placeholderText | Text displayed as the field placeholder, by default it is empty. Availability of the feature depends on the license and may not be available in all deployments. | | **Formatter** (section **Data quality**) | formatter | Name of the formatter used for the field. | | **Field description** (section **Data quality**) | description | Text displayed as a description of the field below it, by default this is an empty value. The availability of this functionality depends on the license and may not be available in all deployments. | | **Sensitive data mask** (section **Security**) | sensitiveDataMask | Definition of the mask type used for entered values, e.g. sensitive data (available types are: NO\_MASK, PESEL, ID\_NUMBER, CELL\_PHONE\_NUMBER, PHONE\_NUMBER). The default type is NO\_MASK, for which no sensitive data masking is applied. Only a value coming from **a data source from another field**. Examples of operation: [Sensitive data mask](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/praca-z-komponentami-bazowymi/walidacja-wartosci-komponentow/maska-danych-sensytywnych.md) Availability of functionality depends on the license and may not be available in all deployments. | | **Preventing disallowed suggestion characters** (section **Security**) | forbidIllegalValues | Default value "false". | | **Paste option** (section **Security**) | pasteEnabledCondition | Conditional pasting into the field (if we set the field value to "false", it will not be possible to paste values from the clipboard into the field). | | **Password** (section **Security**) | password | If set to "true", dots will appear in the field instead of entered characters (i.e. the typed password will not be visible). Default value "false". | | **Icon** (section **Styling**) | iconUrl |

Availability of the feature depends on the license and may not be available in all deployments. Allows displaying an icon in the text field. Provide the icon address as a URL or a file path. Accepted file formats: png, jpg, svg.

| > More information about component properties: [Common component properties](/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/praca-z-komponentami-bazowymi/wspolne-wlasciwosci-komponentow.md)

Figure 1. Example appearance of the component with contextual help.

Figure 2. Example appearance of the inactive component on the application.

Figure 3. Example appearance of the component with prefix and mask presentation.

Figure 4. Example appearance of the component with the Password option.

Figure 5. Example appearance of the component with field description, placeholder, and character counter.

Figure 6. Example appearance of the component with requiredness set.

Figure 7. Example appearance of the component with an icon.

*** ## Autocomplete - supplying suggestions To populate the component with autocomplete enabled with a list of suggestions, you need to connect an External Data Source (EDS) to it, which can be a dictionary or a service. ## **Populating from a service** ### **Input parameters** When populating suggestions from a service, this service can receive information about the value entered in the field or a value from another field. This value can be passed as a service input parameter with the key `__searchText` and used in the script. Therefore, in order to filter the search domain with the value entered in the text field, in ServiceProxy define an input parameter named `__searchText` (the name starts with two underscore characters). This parameter does not need to be connected in any way in the control from Eximee Designer. ### **Output parameters** The service output should be connected to the appropriate component parameters. | Attribute name in the Source | Description | | ----------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | autocompleteValue | Subsequent values to be displayed in the suggestions list. | | showAutocompleteNoMatchButton | Optional flag indicating whether to display an additional button in the suggestions list (described in the autocompleteNoMatchButtonLabelKey property). Default value false. Availability of the feature depends on the license and may not be available in all deployments. | | descriptionText | Additional value displayed together with autocompleteValue. | *** {% hint style="info" %} Demo application: demoKomponentyTekstowe and demoTekstowe Demo application in selected deployments: textFieldIcon {% endhint %} {% hint style="info" %} ♿WCAG: [Good WCAG practices for low-code dev](/documentation/documentation-en/budowanie-aplikacji/proces-biznesowy/tworzenie-procesu-biznesowego-w-bpmn-2.0/dobre-praktyki.md) {% endhint %} --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://docs.eximee.com/documentation/documentation-en/budowanie-aplikacji/interfejs-uzytkownika/formularze/biblioteka-komponentow-bazowych/1-wprowadzanie-danych-inputs/pole-tekstowe-textfield.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.