Button Widget

A lightweight re-implementation of the classic ThingWorx Button widget with improved performance, additional bindings and styling options.

Usage

Can be used as a drop-in replacement for the classic ThingWorx Button widget. It has the same properties.

Properties

Property	Type	Binding	Default	Description
CustomClass	STRING	<>		Enables you to define an html class to the top div of the widget. Multiple classes can be entered, separated by space
Template	LIST	<	Template1	This will be the template used for the widget styling.
Label	STRING(localized)	<		Text to be used for the button
Disabled	BOOLEAN	<	false	Disables the button so it can't be clicked
CancelConfirmationButton	STRING		button2	Allows the user to cancel the confirmation either for first or second button
DefaultConfirmationButton	STRING		button1	Sets the confirmation on the first or the second button.
ConfirmationButton1Label	STRING(localized)		Yes	Message displayed on the first button when the ConfirmationRequired boolean property is checked.
ConfirmationButton2Label	STRING(localized)		No	Message displayed on the second button when the ConfirmationRequired boolean property is checked.
ConfirmationPrompt	STRING(localized)		Do Action?	Message prompted when the ConfirmationRequired boolean property is checked.
ConfirmationTitle	STRING(localized)		Confirm Action?	Title of the Confirmation Window that gets triggered when selecting ConfirmationRequired button.
ConfirmationRequired	BOOLEAN		false	Enables the button to have a confirmation popup before executing the Click event
Tooltip	STRING(localized)	<		Optional tooltip used to describe what the widget does
TabSequence	INTEGER		0	Specifies the tab order of an element (when the tab button is used for navigating)
ShowLoading	BOOLEAN		false	Enable to show a visual indicator that an action was triggered by this button and show when it finished
IsLoading	BOOLEAN	>	false	True if the button is currently in the loading state.
LoadingText	STRING(localized)	<	Loading...	Text shown on the button from when it is clicked, until the ActionDone is triggered
SuccessText	STRING(localized)	<	Success!	Text to show while button is in the "success" state.
FailedText	STRING(localized)	<	Failed!	Text to be displayed while button is in the "failed" state.
DoneTimeout	INTEGER		2000	Time in milliseconds from when the ActionDone was triggered and button returning to its default state
AutomaticServiceLoadingIndicator	BOOLEAN		false	Automatically update the button loading state based on the status of the service it's bound to.
IconURI	STRING	<		URI describing the icon. Either a HTTP link or a reference to an icon in an icon font can be used.
SuccessIconURI	STRING	<	material-outlined:check_circle	Success state icon URI.
FailedIconURI	STRING	<	material-outlined:error	Failed state icon URI.

Services

Property	Type	Binding	Description
ActionSucceeded	SERVICE	<	Used to transition the button from the "loading" to the "Succeeded" state.
ActionFailed	SERVICE	<	Used to transition the button from the "loading" to the "Failed" state.
ActionStarted	SERVICE	<	Used to transition the button into the "loading" state.
PerformClick	SERVICE	<	Used to trigger the button "Clicked" event externally, can be used to replicate the button behavior. This sets the button into "loading" state, and if "AutomaticServiceLoadingIndicator" is false, it will remain indefinitely until ActionSucceeded or ActionFailed is triggered.

Events

Property	Type	Binding	Description
Clicked	EVENT	>	Triggers an event when the button is clicked.
ActionDidSucceed	EVENT	>	Triggers an event when action succeeds.
ActionDidFail	EVENT	>	Triggers an event when action fails.