BPM UI toolkit JavaScript API
Look up a coach view name to find details about the methods, events and other reference information related to programming.
The Alerts control allows developers to create non-intrusive alerts which will not interrupt the user. This control is the "listener", the alerts are sent using bpmext.ui.alert() method
The Area Chart displays data in a chart on a Coach with the option to add drill down trees for presenting additional data sets.
The Badge control displays textual or numerical content and can be programmatically set to be clickable.
The Bar Chart displays data in a chart on a Coach with the option to add drill down trees for presenting additional data sets.
This control allows you to leave a clickable breadcrumb trail.
The button control is used to allow users to continue through a Coach with a 'next' button to another Coach, or to exit a Coach with an 'exit' button for example. The button control always shows a label, to show an Image or an Icon as a button use an Image or Icon control.
The caption box is a container control which alllows more label placement options than other containers.NOTE: Caption box can only contain a single control.
The Check Box is a control that permits the user to make a binary choice, i.e. a choice between one of two possible mutually exclusive options. For example, the user may have to answer 'yes' (checked) or 'no' (not checked) on a simple yes/no question.
The Check Box Group is a multi select control which presents the allowable choices as check boxes.
The Collapsible Panel is a section that comes with many easy to configure behavior and appearance options.
The Configuration control is a debugging and configuration aid. The I18N internationalization service used to internationalize controls is specifed here.
The Data control functions as a hidden input field on the page. It can be bound to data that has no presentation need, but is used in supporting code.
The Data Export control is used to allow users to export the data from a table, repeating layout, or a list of complex objects that contain properties of simple types to a spreadsheet formatted file, supporting file extensions .xlsx and .csv.
The Date Picker control allows for the specification of a date (only, no time) through an entry field or a Calendar widget.
The Date Time Picker control creates an input text field and a calendar to select dates and times for a web form. The picker supports localized calendars, blackout dates and different presentation options.
The Decimal control is meant to display a decimal value and which can be formatted.
The Deferred Section is used to allow lazy loading, which can contribute to efficiency in a Coaches operation since images outside of viewport are not loaded until the user scrolls to them.
The Device Sensor detects information about the current display, including browser, browser version, OS, language, client (window) width, and total screen width. It can be used to change behavior and display, depending on the platform the Coach is being run on (such as displaying a mobile version on phones)
The Donut Chart displays data in a chart on a Coach that comes with many easy to configure behavior and appearance options.
The Event Subscription control listens to be called by a control's event or a function, then grabs the event data that was published and performs the logic provided in the On Published Event. Note that the event is published using the bpmext.ui.publishEvent() method.
The Exit Safeguard control is used as a confirmation message that is activated when the user closes a browser window or tab. This control can be used to prompt the user that they are about the close a window or tab. Note: To combat unwanted pop-ups, some browsers may not display prompts created in beforeunload event handlers unless the page has been interacted with; this is currently true for FireFox. If a user never interacts with a page, the browser does not display the confirmation message.
The Geo Coder control will display a user's address based on their physical location, or a static location using latitude and longitude coordinates can be used as well. This control needs to be used with the Map, OpenLayers API, and Geo Location controls.
The Geo Location control is used when wanting to use the user's location on a map instead of a static location. This control can be used with the Map and OpenLayers API controls, however, this control does not require the OpenLayers API, it is dependent on the device used. The content of the location object and precision of these metrics depends on the device that the ui is running on. There should always be a latitude an longitude available through this object, no matter the device. Worth noting that location is a context variable, available within the On Location Resolved event of this control. In order for this control to work, it must be connected to some sort of data network (whether mobile, wifi, Ethernet, etc. If no connections, this control will not function). The page will request permission to access the user's location information. This is a browser built in security function.
The Horizontal Layout section is used to hold content inside it horizontally (stacked next to each another). Note that this control can be bound to a list which then becomes a repeating section.
The Horizontal Split section is used to hold content inside it horizontally (stacked next to each another) and allows for content to be split into two or more sections.
The Icon control allows the use of icons to be added to Coaches, which can also be used as clickable buttons.
The Image control adds an Image to a Coach and can be programmed to have an on-click event. The Image Control comes with many easy to configure behavior and appearance options.
The Input Group control allows you to add an icon, text or menu to input controls such as Text, Text Area, or Integer controls for example.
The Integer control is used for numerical input or output.
The Line control creates a horizontal line in the coach that can be used to separate controls or sections.
The Line Chart displays data in a chart on a Coach with the option to add drill down trees for presenting additional data sets.
The Link control creates a link to an outside webpage or can be set to a boundary event within a service.
The Map and Google API controls will allow the use of a map to be placed on a Coach, a static location can be set or the user's location can be used. To get a user's location, a Geo Location control must be used.
The Masked Text control allows for text entry within a mask. This can be useful for entering formatted text like phone numbers, postal codes, etc.
The Modal Alert control is an alert that can to be fired when a specified event has occurred. When the Modal Alert appears on the screen, the user needs to handle this control or close it out before the user can return to the main screen.
The Modal Section is a container control that displays modally. I.E. you cannot continue on the main window until it is dismissed.
The Multi Purpose Chart displays data in a chart on a Coach with the option to add drill down trees for presenting additional data sets.
The Multi Select control allows users to select multiple items at a time and is commonly used to create a list of items for selecting.
he Navigation Event Control is used to control pages without the use of buttons, page navigation can be controlled with commands instead.
The Note control displays read-only text, with various Header options for the label.
The Notification control displays textual or numerical content and is commonly used for bringing the user's attention to a specific area on the coach. Note: that the text that is displayed is the label of the control.
The Map and OpenLayers API controls will allow the use of a map to be placed on a Coach, a static location can be set or the user's location can be used. To get a user's location, a Geo Location control must be used.
The Output Text control is a text option that displays read-only text.
The Panel control is a container that can hold any controls and provides a common style for the group of controls.
The Panel Footer control adds footer details to a Panel section. This control needs be used in conjunction with the Panel section.
The Panel Header control adds header details to a Panel section. This control needs be used in conjunction with the Panel section.
The Password control is an enhanced input text option to use when a password is required. The visual data displayed on the screen is masked. The appearance and behavior configuration options give the developer a high degree of flexibility in creating "up front" user input validation.
The Pie Chart displays data in a chart on a Coach with the option to add drill down trees for presenting additional data sets.
The Places control will display desired places based on location coordinates, location type, and radius.
A Pop-up Menu control allows you to create a pop-up menu on other controls. It must be opened programmatically (usually through other controls).
The Progress Bar control offers a visual representation of a users progress completing a particular page. This visual display gives the user an immediate understanding of how many tabs, pages, or input fields have been completed.
The QR Code control is used to direct users to a website by using a QR scanner. Typically, QR scanners are available for download on camera-enabled smart phones for free. It is an easy and convenient way to get users to a particular website, since all they have to do is line up the scanner to the QR code, and they are taken to the website that has been configured on the QR Code control.
The Radio Button Control is a control that can be used either individually or as a group. This control is commonly used to allow a user to make one or more mutually exclusive selections, such as gender or age group.
The Radio button group is a single select control which presents the allowable choices as radio buttons.
Responsive Sensors are used in conjunction with Horizontal and Vertical Layouts to change the way the page displays based on screen/window size.
The Service Call control is used to invoke an AJAX service which can be called On Load, or programmatically.
The Service Data Table control, similar to the Table control, allows you to create a repeating table. The Service Data Table must specify an AJAX service that returns the data that will be displayed in the table. Note: The Service Data Table does not support a binding
The Signature control allows the user to put their signature on the screen using a touch screen or a mouse.
The Single Select control is used to create a dropdown list of items that can be populated statically or retrieved through a service.
The Slider Control is used to display and/or change a numeric value visually, instead of having to manually enter it.
The Spacer control is used to put distance between controls or sections. This control is typically used to modify the default postioning of the controls that follow it.
The Stack section is similar to the Tab section, however onlly one pane (tab) displays at any time.
The Status Box control is used to display a status message on other controls, and is commonly used in conjuction with input controls.
The Step Chart displays data in a chart on a Coach with the option to add drill down trees for presenting additional data sets.
The Style control allows the use of an external CSS file to change the appearance of Coaches.
The Switch control allows the display of a binary value (similar to a check box) using an On/Off visual switch widget.
The Tab Section allows for controls to be organized in tabs and gives the user the ability to switch between the available tabs..
The Table control allows you to create a table using other controls such as Text, Decimal, Output Text, etc.
The Table Layout, Table Layout Row Table Layout Cell are sections meant to hold other controls inside of them for a clean and sleek table appearance. They give you the ability to render an HTML table, i.e. they have nothing to do with the SARK Table/Service Data Table controls.
The Table Layout, Table Layout Row & Table Layout Cell are sections meant to hold other controls inside of them for a clean and sleek table appearance. They give you the ability to render an HTML table, i.e. they have nothing to do with the SARK Table/Service Data Table controls.
The Table Layout, Table Layout Row & Table Layout Cell are sections meant to hold other controls inside of them for a clean and sleek table appearance. They give you the ability to render an HTML table, i.e. they have nothing to do with the SPARK Table/Service Data Table controls
The Text control is used for entering or displaying any text data.
The Text Area control allows users to enter text information into a text box.
The Text Editor control allows users to enter text information into an editor box that comes with many easy to configure appearance and behavior options.
The Text Reader control allows long sections of text to be displayed in a collapsible pane, which may be toggled to show more/less data.
The Timer control can be used to fire any time-related event.
The Tooltip control displays an informative message to users and comes with many easy to configure appearance and behavior options.
The Type Ahead Text control auto fills text based on the selection service attached to it.
The Variant control is a single control that can be used to represent the following controls: Text, Masked Text, Single Select, Date, Decimal, Integer
The Vertical Layout control is used to hold content inside it vertically (stacked on-top of one another).
The Video control adds a video to a Coach.
The Well is a Section that allows multiple controls to be placed inside a styled background.