action

Overview

A list-item supports the action attribute, making it clickable.

Standard Attributes

on-press

Required

Default: unset

Shorthand supported? true

pageon-press

Example: Shorthand syntax

<list>
    <list-item on-press="$:doSomething()" />
</list>

Example: Longhand syntax

<list>
    <list-item>
        <action icon="my-icon-name" on-press="$:doSomething()" />
        <!-- or -->
        <!-- With dynamic list-items you can pass the selected item as a parameter via $selection -->
        <action icon="my-icon-name" on-press="$:doSomething($selection)" />
    </list-item>
</list>

The on-press attribute has no effect if the bind attribute is set.

Advanced Attributes

icon

Optional

Type: string

Default: unset

Shorthand supported? true

The icon to display on the right-hand side of the list-item. The icon can be a one of JourneyApps' supported icons.

Example: Shorthand syntax

<list>
    <list-item on-press-icon="fa-plus" on-press="$:doSomething()" />
</list>

Example: Longhand syntax

<list>
    <list-item>
        <action icon="fa-plus" on-press="$:doSomething()" />
    </list-item>
</list>

validate

Optional

Type: boolean

Default: false

Shorthand supported? false

Whether to run field validation before calling the associated on-press (see above). Can be either true, false, or the result of a function, e.g. $:shouldBeValidated().

<list>
    <list-item>
        <action icon="fa-plus" on-press="$:doSomething()" validate="true" />
    </list-item>
</list>