> For the complete documentation index, see [llms.txt](https://docs.poweredbybackstage.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.poweredbybackstage.com/modules/text-input.md).

# Text Input

![A text input module marked required for users, with placeholder input](https://2635135911-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F9NyC60xfSabdCmQW0heP%2Fuploads%2FiikAU40d35JMRLlCSYtE%2Ftext-input-module.png?alt=media\&token=a502f339-484f-42f7-9f89-eca575ee6b27)

## Overview

## Overview

A **Text Input module** allows you to add a standard HTML input field that allows for text input usually found in a form submission box.

## TextInput Properties <a href="#properties" id="properties"></a>

**Input Type**\
*Dropdown - `String` or `Number`*\
Sets the input type requirement. An error will display if invalid input is submitted.

## Text Validation Options

**Is this field required?**\
*Checkbox, default `disabled`*\
If enabled, guests will be required to toggle this switch on. If a guest attempts to submit the form without toggling it on, a default error message will be displayed.

**Custom Required Message**\
*String*\
This field can be used to customize the error message to be displayed if the switch for required field is not toggled on. Example: *'Please toggle this switch before proceeding.'*

### Min Length

**Value**\
*Number*\
Sets the minimum text character length required on a text input, this is common for passwords. Example: `9`

**Rule Error Message**\
*String*\
Sets the error message displayed if the submitted text input does not meet the required min `value`. Example: '*This password does not meet the minimum length of 6 characters.'*

### Max Length

**maxLength**\
*Number - 18*\
Sets the maximum text character length required on a text input.

**Rule Error Message**\
*String*\
Sets the error message displayed if the submitted text input is longer than the defined max `value`. Example: '*Your password can't be longer than 16 characters.'*

### Regex Pattern

[**Regex Pattern**](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions)\
*Regex*\
A validation regular expression that can be passed to validate the text input. This is commonly used for email validation. See [Regex](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_Expressions) for more information.

**Rule Error Message**\
*String*\
Sets the error message displayed if the input does not match the regexp. Example: '*This input field is invalid.'*

## Properties

**Input Id**\
*String*\
Sets the Id of the text input field, which can be referenced by other elements.

**Input Label**\
*String*\
Sets the label of the input field, displayed above the input field. Example: '*Your Email'*

**Input Placeholder**\
*String*\
Sets the displayed placeholder text within the text input field. Example: *'<test@test.com>'*

**Style attribute**\
*String, css style property input*\
Can apply additional CSS to customize the switch.
