---
tags: brew-js
---

# Click actions

## Methods

### `addAsyncAction`

## Directives

### `data-href="[path]"`

| App events | DOM events | Other directives | Triggers |
| ---------- | ---------- | ---------------- | ---------- |
| - | `click` | - | `navigate` |

### `toggle="[selector]"`

| App events | DOM events | Other directives | Triggers |
| ---------- | ---------- | ---------------- | -------- |
| - | `click` | - | - |

### `toggle-class="[name]"`

| App events | DOM events | Other directives | Triggers |
| ---------- | ---------- | ---------------- | -------- |
| - | `click` | - | - |

Toggles CSS classes when an element is clicked.

An optional `toggle-class-for` attribute can be specified to toggle CSS class(es) for another element.

### `disabled`, `class="disabled"`

| App events | DOM events | Other directives | Triggers |
| ---------- | ---------- | ---------------- | -------- |
| - | `click` | - | - |

Stops everything else from executing.

### `context-method="[name]"`

| App events | DOM events | Other directives | Triggers |
| ---------- | ---------- | ---------------- | -------- |
| - | `click` | - | - |

Executes the method on the `app` instance.

If the element is inside a form, the form data is supplied to the method in the first argument. Also, the form is validated and only the method is called only when the form data is valid.

### `context-form="[selector]"`

| App events | DOM events | Other directives | Triggers |
| ---------- | ---------- | ---------------- | -------- |
| - | - | `context-method` | - |

Supply data to the method by the specified form. This is used when a button is outside a `<form>` element

### `validate="[selector?]"`

| App events | DOM events | Other directives | Triggers |
| ---------- | ---------- | ---------------- | -------- |
| - | `click` | - | - |

Validates the specified form. This is used when a button is outside a `<form>` element