Skip to content

Input

The Input component is used to capture user-entered values on a Lowgile screen.

Typical use cases include text fields, numbers, descriptions, quantities, and comments.

  • Path: Components → CORE → Input

Use the Input component when you need to:

  • Capture user-entered text or numbers,
  • Allow editing of data in a form, and
  • Bind values to a screen variable or data object.

In the Lowgile screen editor:

  1. Navigate to the CORE section of the Components toolbar.
  2. Drag the Input component onto the screen.
  3. Position it where the value should be captured.
  4. Add the relevant properties.
  5. Bind it to a variable or data object.

Insight

Inputs are typically used inside forms or grouped within layout components such as cards or grids.

When configuring an input, you will work across four tabs:

TabPurpose
PropertiesDefines label, value binding, and basic behavior.
AppearanceControls visual presentation such as placeholder text.
StylesControls layout, spacing, and alignment.
EventsHandles input-related events such as change or focus.

An input must be bound to a value so Lowgile knows where to store the user’s input.

Typical bindings include:

  • Screen variables (e.g., screen.comment)
  • Objects passed into the screen (e.g., request.description)

Attention

If an input is not bound to a variable or object, the entered value will not be stored.

The following patterns show how inputs are commonly bound and used in Lowgile screens.

Bind the input to a screen variable:

screen.comment

Bind directly to an object property:

request.description

Wrap the input with a Disable component to prevent editing.

Use clear labels that describe the expected input:

  • Description
  • Quantity
  • Budget amount
  • Comment

Avoid vague labels like Value or Field.

Key Lesson

Inputs define how users provide data. Always bind them correctly and label them clearly to avoid confusion.