# Input

Input boxes take in simple user input as a string.

<figure><img src="/files/iQh7jtUX6yQuBmIsYuGu" alt=""><figcaption></figcaption></figure>

## Properties

<figure><img src="/files/9Z1WdO2MqVpM3yCNzks5" alt=""><figcaption></figcaption></figure>

**Form item name:** This is the name that the encompassing form will use to access the output of the checkbox. See [Custom Form](/app-builder/app-construction/elements/form-elements/custom-form.md) for how it's used.

**Input type:** Select the input type that users will be expected to input.

**Default value:** The default value to output if the user does not input anything.

**Max length:** Maximum number of characters a user will be able to input.

**Show word limit:** Show the ratio of characters inputted / total characters allowed.

**Clearable:** Will the user be able to clear their input?

**Input placeholder:** Placeholder text to be displayed. Note that the input will not take on this value, as oppposed to the default value.

**Size:** Select a size for the input element.

See [Form Check](/app-builder/app-construction/elements/form-check.md) for data validation.

See [Tooltip](/app-builder/app-construction/elements/tooltip.md) for tooltip configurations.

## Output

The output of this element is set using Input type in properties.

## Supported Events

**Focus:** Triggered when a user selects the input.

**Blur:** Triggered when a user deselects the input (clicks outside).

**Value input:** Triggered when a user types in the input.

**Value change:** Triggered when a user changes the value of the input and either the input is deselected or users press Enter.

**Press enter:** Triggered when users press Enter when in the input.

## Supported Actions

**Set Value:** Set the output value.

**Get Value:** Get the value of the input.

**Set Validate Result:** Set whether the input is valid.

**Set Data:** Change element data. See [Data Store](/app-builder/app-construction/data-store.md).

**Set Loading:** Set loading animation. See [Set loading animations](/app-builder/popular-use-cases/set-loading-animations.md).

{% hint style="info" %}
Visit [Interactions](/app-builder/app-construction/interactions.md) for more on events and actions.
{% endhint %}


---

# Agent Instructions: 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:

```
GET https://docs.acho.io/app-builder/app-construction/elements/form-elements/input.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
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.