Creating Toast with JavaScript
JavaScript can be used to create a Toast at any time in a Workflow, and allows more flexibility to include dynamic parameters.
How To
Simple Syntax
In the simple syntax, there is a different function for each Toast style:
Script.Toast.Success(, , );
Script.Toast.Error(, , );
Script.Toast.Warning(, , );
Script.Toast.Info(, , );
Script.Toast.Loading(, , );
|
Name
|
Required / Optional
|
Explanation
|
|
title
|
Optional
|
The title to use within the toast. Defaults to "" (blank).
|
|
message
|
Optional
|
The text to display in the body of the toast. Defaults to "" (blank).
|
|
duration
|
Optional
|
After the toast has been displayed maximised for 2 seconds, the duration in milliseconds that the toast will displayed minimised. Specify 0 to leave open until user closes it, defaults to 5000.
|
Full Syntax
The advanced syntax allows some additional control over the created Toast:
Script.Toast.Show(, , , , , );
|
Name
|
Required / Optional
|
Explanation
|
|
text
|
Required
|
The text to display in the body of the toast.
|
|
type
|
Optional
|
The type of toast to display (Script.Toast.Type.Success, Script.Toast.Type.Error, Script.Toast.Type.Warning, Script.Toast.Type.Information or Script.Toast.Type.Loading). Defaults to Script.Toast.TypeInformation.
|
|
title
|
Optional
|
The title to use within the toast. Defaults to "" (blank).
|
|
duration
|
Optional
|
After the toast has been displayed maximised for 2 seconds, the duration in milliseconds that the toast will displayed minimised. Specify 0 to leave open until user closes it, defaults to 5000.
|
|
closable
|
Optional
|
Boolean (true or false). Specifies whether the user is able to manually close the toast. Note that if the duration is set to 0, then this is forced to true. Defaults to true.
|
|
id
|
Optional
|
Provide a unique identifier to be able to refer back to at a later date (e.g, to remove it). The id is returned from the Show function, and if the id of a created toast is the same as an existing toast then it will replace the existing toast. If an id is not specified, one is generated automatically.
|
Example:
|
Script.Toast.Show(
"Retrieving information for: " + [var_csCallerName],
Script.Toast.Type.Loading,
"Retrieving Customer Details",
0,
true,
"customerDetails"
);
|
Full Syntax (Alternate)
Since many of the arguments for the advanced syntax are optional, there is an alternate syntax where a JavaScript object is passed instead:
Script.Toast.Show();
|
Name
|
Required / Optional
|
Explanation
|
|
text
|
Required
|
The text to display in the body of the toast.
|
|
title
|
Optional
|
The title to use within the toast. Defaults to "" (blank).
|
|
type
|
Optional
|
The type of toast to display (Script.Toast.Type.Success, Script.Toast.Type.Error, Script.Toast.Type.Warning, Script.Toast.Type.Information or Script.Toast.Type.Loading). Defaults to Script.Toast.TypeInformation.
|
|
initialShowDuration
|
Optional
|
How long in milliseconds the toast is initially displayed maximised. Specify 0 to never appear maximised, defaults to 2000.
|
|
duration
|
Optional
|
After the toast has been displayed maximised for 2 seconds, the duration in milliseconds that the toast will displayed minimised. Specify 0 to leave open until user closes it, defaults to 5000.
|
|
closable
|
Optional
|
Boolean (true or false). Specifies whether the user is able to manually close the toast. Note that if the duration is set to 0, then this is forced to true. Defaults to true.
|
|
id
|
Optional
|
Provide a unique identifier to be able to refer back to at a later date (e.g, to remove it). The id is returned from the Show function, and if the id of a created toast is the same as an existing toast then it will replace the existing toast. If an id is not specified, one is generated automatically. Mutually exclusive with sender.
|
|
sender
|
Optional
|
Provide a JavaScript object containing an id and name. The id provided will function the same as the id above, and the name will be displayed as faded text below the message. Mutually exclusive with id.
|
|
minimize
|
Optional
|
Boolean (true or false). Specifies whether the toast will minimise after the initialShowDuration, or remain maximised for both the initialShowDuration and duration. Defaults to true.
|
|
icon
|
Optional
|
Provide a Font Awesome icon name to change the icon that is displayed on the toast. Only icon names that are available to the version of Font Awesome listed in the Third Party Libraries are available, and it is possible to specify the colour of the icon from a limited list of fa-white, fa-grey, fa-black, fa-red, fa-orange, fa-yellow, and fa-green. Default is specified by the type. |
This means that only the desired optional parameters need to be passed:
|
Script.Toast.Show({
id: "BasketToast",
title: "Item added to basket",
text: [Selected Quantity] + "x " + [Product Name],
icon: "fa-cart-arrow-down fa-green",
initialShowDuration: 3000,
duration: 7000
});
|
Any optional parameters that are omitted will use their default value, as stated in the above table. As this is a JavaScript object, the order in which the parameters are listed in this alternate syntax doesn't matter, as long as the key:value pairs are preserved.
Notes
As multiple duplicate Toast popups can be created, it is advised that caution is used if this function is invoked in a Calculate Field, due to the way that Calculate Fields will run every time a field is selected or action is taken.
As the function returns the name of the created Toast, it's possible to close the Toast later even without a name defined:
|
var myToast = Script.Toast.Success("Title", "Text", 0);
if (myCondition == "yes") { Script.Toast.Hide(myToast); }
|
