---
title: "au-widget-function-trigger/au-widget-function-trigger | Customer's Canvas On-Premises"
canonical: "https://customerscanvas.com/docs/on-premises/ui-framework/widgets/reference/au-widget-function-trigger.au-widget-function-trigger/"
---

# au-widget-function-trigger/au-widget-function-trigger

> A non-visual widget that is used to listen for property changes to execute custom functions. Can be used in other widgets.

## Classes

### AuWidgetFunctionTrigger

The following example illustrates how you can listen for property changes to execute custom functions.

```json
{
  "widgets": [
   {
      "name": "name",
      "type": "option",
      "params": {
          "type": "list",
          "title": "Name",
          "prompt": "Choose a name",
          "values": [
              { "title": "Jack" },
              { "title": "James" },
              { "title": "John" }
           ]
      }
   },
   {
     "name": "myFunction",
     "type": "function-trigger",
     "params": {
          "arguments": [
             "{{ $['name']._.title }}",
             "{{ $['name']._.title }}"
          ],
          "callback": [
              "{{ #function(arg1, arg2) console.log(arg1, arg2) }}",
              "{{ #asyncFunction await new Promise(...) }}"
          ]
          "catch": [
             "{{ #function console.error("failed") }}",
          ],
          "finally": [
             "{{ #function console.log("cleanup") }}",
          ]
     }
   }
 ]
}
```

#### Constructors

##### Constructor

```ts
new AuWidgetFunctionTrigger(): AuWidgetFunctionTrigger;
```

###### Returns

[`AuWidgetFunctionTrigger`](#auwidgetfunctiontrigger)

###### Inherited from

```ts
AuBaseInvisibleWidget.constructor
```

#### Properties

##### enabled

```ts
enabled: boolean = true;
```

If `false`, the `callback` will not be executed. The default value is `true`.

##### params

```ts
params: any;
```

Compiled widget configuration.

###### Inherited from

```ts
AuBaseInvisibleWidget.params
```

#### Accessors

##### template

###### Get Signature

```ts
get static template(): any;
```

###### Returns

`any`

###### Inherited from

```ts
AuBaseInvisibleWidget.template
```

#### Methods

##### checkInitDependenciesWidgets()

```ts
checkInitDependenciesWidgets(): string[];
```

Returns an array of widget names, due to which the current widget cannot receive parameters.

###### Returns

`string`[]

###### Inherited from

```ts
AuBaseInvisibleWidget.checkInitDependenciesWidgets
```

##### resetPreloaderState()

```ts
resetPreloaderState(): void;
```

###### Returns

`void`

###### Inherited from

```ts
AuBaseInvisibleWidget.resetPreloaderState
```

##### showPreloader()

```ts
showPreloader(
   isPreload, 
   message?, 
   timeout?): void;
```

Shows a preloader.

```
"onClick": [
  "{{#function main.showPreloader(true, 'Creating print files...')}}",
  "{{#function $['editor'].getHiResImages(800,800)}}",
  "{{#function main.showPreloader(false)}}"
]
```

###### Parameters

| Parameter | Type | Default value | Description |
| ------ | ------ | ------ | ------ |
| `isPreload` | `boolean` | `undefined` | If `true`, enables the preloader. |
| `message` | `string` \| `string`[] | `...` | A text message that appears next to the preloader. |
| `timeout` | `number` | `5` | - |

###### Returns

`void`

###### Inherited from

```ts
AuBaseInvisibleWidget.showPreloader
```

##### showToast()

```ts
showToast(data?, duration?): void;
```

Shows a toast.

```
return editor.loadUserInfo(data)
    .catch(err => {
        this.widget.showToast("Error: Invalid data");
        console.log(err);
    });
```

###### Parameters

| Parameter | Type | Description |
| ------ | ------ | ------ |
| `data?` | `string` | A string message to display in the toast. |
| `duration?` | `number` | Defines how long to show the toast for. |

###### Returns

`void`

###### Inherited from

```ts
AuBaseInvisibleWidget.showToast
```

## References

### widget

Renames and re-exports [AuWidgetFunctionTrigger](#auwidgetfunctiontrigger)