> For the complete documentation index, see [llms.txt](https://docs.servoy.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.servoy.com/reference/servoyextensions/browser-plugins/toastr-notifications.md).

# 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
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## 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, and the optional `goal` query parameter:

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

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.