Overview

Auto close popup or a toaster can be used with this JS action, and you can also position the toaster message and 5 different places based on your requirement.

Documentation

Description

The "Auto Close Popup or Toaster JS" action is a custom JavaScript action that allows you to display a popup or toaster message with an auto-close feature in your Mendix application. This action provides flexibility in choosing between a popup or a toaster, specifying the message content, setting the position for the toaster, and defining the auto-close timer.

Typical usage scenario

Here's an example of how to use the "Auto Close Popup or Toaster JS" action in a Nanoflow:

Create a Nanoflow and name it "Display Notification".

Drag and drop the "Auto Close Popup or Toaster JS action onto the canvas.

Configure the parameters as follows:

popUpOrToaster: Set it to 'Toaster'.

message: Enter the message you want to display, e.g., 'Sample Message'.

toasterPosition: Choose 'Top Left'.

timer: Set it to 3 (3 seconds).

Connect the "Auto Close Popup or Toaster JS action to other actions or flows in your Nanoflow, or simply end the flow.

Save the Nanoflow.

Now, whenever you execute the "Display Notification" Nanoflow, a toaster message with the content "Sample Message" will be displayed at the Top Left corner of the screen and automatically close after 3 seconds.

Features and limitations

· Display either a popup or a toaster message with customizable settings.

· Specify the content of the message to be displayed.

· Choose the position of the toaster message (applicable only for the toaster).

· Set the duration (in milliseconds) after which the notification will automatically close.

· Supports custom styling for both popups and toaster messages.

Configuration

The "Auto Close Popup or Toaster JS" action can be used in a Nanoflow in Mendix to display popup or toaster messages with customizable settings.

Follow the steps below to utilize this action in your application:

1.) Import the "Auto Close Popup or Toaster JS" action into your Mendix project.

2.) In your Nanoflow, drag and drop the "Auto Close Popup or Toaster JS" action from the Toolbox onto the canvas.

3.) Configure the following parameters for the action:

popUpOrToaster: Specify the type of notification to display. Set it to 'Popup' to display a popup or 'Toaster' to display a toaster message.

message: Enter the message content you want to display in the notification.

toasterPosition (only applicable if popUpOrToaster is set to 'Toaster'): Choose the position where the toaster message should appear. Available options are 'Top Right', 'Top Left', 'Bottom Right', 'Bottom Left', and 'Center'.

timer: Set the duration (in seconds) after which the notification will automatically close.

4.) Connect the "Auto Close Popup or Toaster JS" action to other actions or flows in your Nanoflow as needed.

5.) Execute the Nanoflow in your application to trigger the display of the popup or toaster message.