# Web Notifications (Toastr)

(part of package '[Web Notifications](/reference/servoyextensions/packages/browser-plugin-packages/web-notifications.md)')

You can access it in code via: **plugins.webnotificationsToastr**

## Properties

## API

### clear()

Removes current toasts using animation

***

### clearToastr(toastrId)

Removes the toast with the given ID

**Parameters:**

> * {[Object](/reference/servoycore/dev-api/js-lib/object.md)} toastrId The unique identifier of the toast notification to be removed.

***

### createToastrOptions()

Returns new, empty toastrOptions

**Returns:** [CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions) A new, empty toastrOptions object for configuring toast notifications.

***

### error(message,title,options,toastrId,onClick)

Shows an error toastr with the given message, optional title and options

**Example:**

```js
plugins.webnotificationsToastr.error('Oh no. Something went wrong. It will be OK', 'Error', null, 'sampleID', onClickDialog);

function onClick(toastrId) {
	application.output('toastrId');
}
```

**Parameters:**

> * {[String](/reference/servoycore/dev-api/js-lib/string.md)} message The message to show
> * {[String](/reference/servoycore/dev-api/js-lib/string.md)} \[title] The optional title shown above the message
> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} \[options] The toastrOptions object with additional options
> * {[Object](/reference/servoycore/dev-api/js-lib/object.md)} \[toastrId] The optional id that can be used to clear this specific toastr via clearToastr
> * {[Function](/reference/servoy-developer/component_and_service_property_types.md#function)} \[onClick] The optional callback function when the toastr is clicked

***

### info(message,title,options,toastrId,onClick)

Shows an info toastr with the given message, optional title and options

**Example:**

```js
plugins.webnotificationsToastr.info('Hey, Servoy World is coming up in May!', 'Servoy World', null, 'sampleID', onClickDialog);

function onClick(toastrId) {
	application.output('toastrId');
}
```

**Parameters:**

> * {[String](/reference/servoycore/dev-api/js-lib/string.md)} message The message to show
> * {[String](/reference/servoycore/dev-api/js-lib/string.md)} \[title] The optional title shown above the message
> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} \[options] ToastrOptions object with additional options
> * {[Object](/reference/servoycore/dev-api/js-lib/object.md)} \[toastrId] Optional id that can be used to clear this specific toastr via clearToastr
> * {[Function](/reference/servoy-developer/component_and_service_property_types.md#function)} \[onClick] Optional callback function when the toastr is clicked

***

### setGlobalOptions(options)

Sets the given options globally

**Parameters:**

> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} options ToastrOptions

***

### success(message,title,options,toastrId,onClick)

Shows a success toastr with the given message, optional title and options

**Example:**

```js
plugins.webnotificationsToastr.success('Hey, Servoy World is coming up in May!', 'Servoy World', null, 'sampleID', onClickDialog);

function onClick(toastrId) {
	application.output('toastrId');
}
```

**Parameters:**

> * {[String](/reference/servoycore/dev-api/js-lib/string.md)} message The message to show
> * {[String](/reference/servoycore/dev-api/js-lib/string.md)} \[title] The optional title shown above the message
> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} \[options] ToastrOptions object with additional options
> * {[Object](/reference/servoycore/dev-api/js-lib/object.md)} \[toastrId] The optional id that can be used to clear this specific toastr via clearToastr
> * {[Function](/reference/servoy-developer/component_and_service_property_types.md#function)} \[onClick] The optional callback function when the toastr is clicked

***

### warning(message,title,options,toastrId,onClick)

Shows a warning toastr with the given message, optional title and options

**Example:**

```js
plugins.webnotificationsToastr.warning('Hey, Servoy World is coming up in May!', 'Servoy World', null, 'sampleID', onClickDialog);

function onClick(toastrId) {
	application.output('toastrId');
}
```

**Parameters:**

> * {[String](/reference/servoycore/dev-api/js-lib/string.md)} message The message to show
> * {[String](/reference/servoycore/dev-api/js-lib/string.md)} \[title] The optional title shown above the message
> * {[CustomType\<webnotificationsToastr.toastrOptions>](#toastroptions)} \[options] The toastrOptions object with additional options
> * {[Object](/reference/servoycore/dev-api/js-lib/object.md)} \[toastrId] The optional id that can be used to clear this specific toastr via clearToastr
> * {[Function](/reference/servoy-developer/component_and_service_property_types.md#function)} \[onClick] The optional callback function when the toastr is clicked

***

## Types

## toastrOptions

Options to configure the appearance and behavior of toastr notifications. scripting type: CustomType\<webnotificationsToastr.toastrOptions>

* actionButton
  * If true will show a custom toastr with an additional action
  * **Type**: [boolean](/reference/servoycore/dev-api/js-lib/boolean.md)
  * **Default Value**: "false"
* actionButtonText
  * When the actionButton is true, set the text to show for the action section; can be an html string
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* closeButton
  * If true, a close button is displayed on the toast.
  * **Type**: [boolean](/reference/servoycore/dev-api/js-lib/boolean.md)
* closeHtml
  * The HTML for the close button.
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* disableTimeOut
  * If true, disables the auto-hide timeout.
  * **Type**: [boolean](/reference/servoycore/dev-api/js-lib/boolean.md)
* enableHtml
  * If true, allows HTML content in the toast message.
  * **Type**: [boolean](/reference/servoycore/dev-api/js-lib/boolean.md)
* extendedTimeOut
  * The time in milliseconds for extended timeout on hover.
  * **Type**: [int](/reference/servoycore/dev-api/js-lib/number.md)
* hideDuration
  * The duration in milliseconds for the hide animation.
  * **Type**: [int](/reference/servoycore/dev-api/js-lib/number.md)
* hideEasing
  * The easing function to use when hiding the toast.
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* hideMethod
  * The method used to hide the toast (deprecated for old jQuery implementations).
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* messageClass
  * CSS class applied to the toast message.
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* newestOnTop
  * If true, newer toasts appear on top of older ones.
  * **Type**: [boolean](/reference/servoycore/dev-api/js-lib/boolean.md)
* onActivateTick
  * If true, activates a tick animation when the toast is activated.
  * **Type**: [boolean](/reference/servoycore/dev-api/js-lib/boolean.md)
* positionClass
  * CSS class that determines the position of the toast notification.
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* progressAnimation
  * The type of animation used for the progress bar.
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* progressBar
  * If true, displays a progress bar within the toast.
  * **Type**: [boolean](/reference/servoycore/dev-api/js-lib/boolean.md)
* showDuration
  * The duration in milliseconds for the show animation.
  * **Type**: [int](/reference/servoycore/dev-api/js-lib/number.md)
* showEasing
  * The easing function to use when showing the toast.
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* showMethod
  * The method used to show the toast (deprecated for old jQuery implementations).
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* tapToDismiss
  * If true, clicking on the toast will dismiss it.
  * **Type**: [boolean](/reference/servoycore/dev-api/js-lib/boolean.md)
* timeOut
  * The time in milliseconds before the toast auto-hides.
  * **Type**: [int](/reference/servoycore/dev-api/js-lib/number.md)
* titleClass
  * CSS class applied to the toast title.
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)
* toastClass
  * CSS class applied to the toast container.
  * **Type**: [string](/reference/servoycore/dev-api/js-lib/string.md)

***


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.servoy.com/reference/servoyextensions/browser-plugins/toastr-notifications.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.