Text

A text input is the simpilest form component as it maps directly to a <input/> HTML element.

Example

FormInput("name")

Common Methods

For a list of common field component methods, see here.

Type

You can set the type for your <input/> field using as so:

FormInput("name").
    Text(). // Default - Not required.
    Email().
    URL().
    Password().
    Number().
    Telephone()

You're also able to set the type via a callback to any string of your choosing.

FormInput("name").
    TypeFn(
        func(ctx FieldContext) string {
            return "date"
        }
    )

Numeric Steps

When a form input is placed into the numeric mode. You are able to customize the numeric step:

// static
FormInput("name").
    Number().
    NumericStep(10)

// callback
FormInput("name").
    Number().
    NumericStep(
        func (ctx FieldContext) int {
            return 100
        }
    )

Mode

You can set the mode of your text input as follows:

FormInput("name").
    ModeText(). // Default - Not required.
    ModeDecimal().
    ModeEmail().
    ModeNone().
    ModeNumeric().
    ModeSearch().
    ModeTelephone().
    ModeURL()

You're also able to set the mode via a callback to any string of your choosing.

FormInput("name").
    ModeFn(
        func(ctx FieldContext) string {
            return "your mode"
        }
    )

Icons

Text Inputs can have prefix or postfix icons included inside the text input container.

For a list of avaliable icons, please see our icons section.

Prefix Icons

FormInput("name").
    PrefixIcon(icons.Users)

Postfix Icons

FormInput("name").
    PostfixIcon(icons.Star)

Autocomplete

Autocompletion defaults to false. You can enable autocompletion of your input element using:

// static
FormInput("name").
    Autocomplete()

// callback
FormInput("name").
    AutocompleteFn(
        func(ctx FieldContext) bool {
            return true
        }
    )