Notifications

We will show you how to show a notification, when a form to email has been submitted successfully. Note that this is just an example and it is the same for any other event on your page and for any server action which you are using.

First we have to add the Notifications Component on the page. Right click App in the App Structure:

Open the Alerts menu:

And select Notifications:

In the properties panel you will find the Position and Display options for the Notifications component. Here you can setup the position, align, offset and spacing options as well as the timeout for the notification. Enable the closable option if you need to show a close icon inside the notification:

You can edit the default styling for the notifications - success, info, danger and warning:

Select one of the notification styles and setup the text color, background style or the icon. The icons used here are font-awesome icons:

When you setup your notification style and appearance, select the component which will control them. In our example it is a server connect form(1), which sends the details to an email address. Add new dynamic event (2):

Select server connect:

And select on success or whatever event you need to show notification on. You can show different notifications on different dynamic events as well:

Then click the dynamic action picker:

Select the notification type you want to use(1) and click the add button(2):

In the text you can either select dynamic value, using the dynamic data picker or enter static text message. Static text must be wrapped in single quotes:

Click Select and you are done: