The SPARK documentation can be found within support.salientprocess.com. There are knowledge base articles describing the controls and how-to use them. In addition, there is forum questions, and JS documentation for each control.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Forum Page – https://support.salientprocess.com/forums/
Articles – https://salientprocess.zendesk.com/hc/en-us
Yes, SPARK controls can be used with Coach NG controls.
Forum Question – https://support.salientprocess.com/forums/topic/are-there-any-restrictions-on-mixing-coach-view-technologies/
Spark is based on HTML5, JavaScript, CSS3 (Bootstrap CSS) and the Coach NG framework. It is not based on Dojo or jQuery.
Forum Question – https://support.salientprocess.com/forums/topic/what-webjavascript-frameworks-is-spark-based-upon/
SPARK Info – http://salientprocess.com/spark-toolkits/
Within the support site of Salient Process, various resources exist that provide information regarding SPARK controls. A list of articles and JS documentation exists for every control include in the Enterprise version of SPARK.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Forum Page – https://support.salientprocess.com/forums/
Articles – https://salientprocess.zendesk.com/hc/en-us
Yes, all SPARK toolkits work with BPM 8.5.0.1, BPM 8.5.5, BPM 8.5.6, and BPM 8.5.7 versions of BPM.
SPARK Assets Page – https://support.salientprocess.com/your-membership/
To access the control’s view, use the ${Control_ID} syntax. To access a control’s value, use: ${Control_ID}.getValue() or @{Control_ID} (both of these syntaxes are equivalent). After accessing the control’s view, various control methods can be performed by calling them.
Control Addressing Article – https://salientprocess.zendesk.com/hc/en-us/articles/211965868-Control-Addressing-
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls
A control within a Coach View can be referenced using the keyword this to reference the view class. After referencing the view class, access the view of the control by using the syntax: this.ui.get(“Control_ID”). Set the view to a JS variable and perform control methods by calling them.
Control Addressing Article – https://salientprocess.zendesk.com/hc/en-us/articles/211965868-Control-Addressing-
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
To change the visibility of a control during run-time, three different ways can be used. Under the Visibility option in a control’s properties, the visibility can be chosen within the selection drop-down. The visibility can also be adjusted programmatically by using the show()/hide() methods, as well as the setVisible(true)/setVisible(false, true) (the second parameter of the setVisible() method is an optional parameter to set the visibility to none versus hide).
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
To perform input validation on an input control you make use of the setValid() and isValid() methods. You can set the control validity to true or false using the setValid() method, and then check against it with the isValid() method.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Input Validation Video – https://youtu.be/Almz2bDgFBo
Input Validation Article – https://salientprocess.zendesk.com/hc/en-us/articles/213475847-Validation-with-SPARK
To prevent a SPARK control boundary event from being triggered, the return keyword can be used. For example, if on the on click event of a Button control you wanted to stop a user from leaving the coach before a condition is met, use the syntax: return false;.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Input Validation Video – https://youtu.be/Almz2bDgFBo
Yes, custom styling can be applied with SPARK by using the Style control. The Style control allows multiple CSS files to be applied to a page. The SPARK Styler Process App can be used to generate custom CSS files for specifically SPARK controls.
Style Article – https://salientprocess.zendesk.com/hc/en-us/articles/205942288-Style
SPARK offers 3 separate types of layout controls: basic containers (Panels, Wells, Tab Sections, etc.), layout containers (Horizontal/Vertical layouts, Table Layout/Row/Cell), and responsive containers (Responsive Sensor, Page Layout Cell/Col/Row). Often times these layout container controls will be used in conjunction with one another to make sophisticated designs.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Layout Article – https://salientprocess.zendesk.com/hc/en-us/articles/206207508
Article Forum Question – https://support.salientprocess.com/forums/topic/differences-between-layouts/
To add rows to a table client-side, use the appendElement() method available within the Table control. Within the method, a JavaScript object can be passed in using the syntax: appendElement({“Data_Object_Parameter_ID” : Data Being Passed in of same type as parameter}).
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Adding Rows to Table Article – https://salientprocess.zendesk.com/hc/en-us/articles/205605278-Adding-Rows-to-a-Table-Dynamically-
Within the configuration properties of a control (decimal control for example), there is a dropdown option called formula where data can be evaluated. To total all values of a specific column use the following syntax: SUM(${Table_Control_ID/Column_Control_ID*}) (note this is when pagination is not applied). The ability to execute formulas on row data of various column values also is available.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Formula Article – https://salientprocess.zendesk.com/hc/en-us/articles/206348467-Formulas-
Formula Video – https://youtu.be/MQ7oZoraORU
Yes, to get the specific index of a row when it has been selected use the getSelectedIndex() method of the Table control. This method will return an integer of the row’s index within the table based on 0-based indexing.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Both pagination and sorting are available out-of-the-box with the SPARK Table control. Within the configuration property option there is a drop-down option called Behavior. Within the Behavior option select the Show Footer and Show Pager checkboxes to enable pagination. Within the Columns option check Sortable for any column you need to be sortable.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Like Coach NG, TeamWorks Variables can be bound to controls through the data binding. To access the bound data to modify or read it, use the getData() and setData() methods. Note—the bound data should be the same type as the control’s expected binding type. If a complex data object is used, the Data control can be used to hold the variable.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
The available rendering types are: Coach View, Seamless Coach View, Simple HTML, and Custom. The coach view and seamless coach view both allow controls within the column to be treated as coach views, with the difference being that the seamless coach view removes borders of the control (mostly used on input controls). The Simple HTML option renders as plain HTML, and custom allows the developer to define the rendering options.
Table Article – https://salientprocess.zendesk.com/hc/en-us/articles/206521927-Table
Different Column Types Article – https://salientprocess.zendesk.com/hc/en-us/articles/213440387-Differences-between-Table-Column-Rendering-Types
Yes, developers have the ability to create their own controls.
Creating Your Own Controls Article – https://salientprocess.zendesk.com/hc/en-us/articles/217879818-Creating-Your-Own-Control
SPARK tables have the ability to use Asynchronous Loading to perform a better UI experience. Applying the Asynch Loading option within the Configuration Property of a control provides better loading times for larger sets of data. The Async Batch Size option can further configure the async loading.
Table Article – https://salientprocess.zendesk.com/hc/en-us/articles/206521927-Table
Populating a Single-Select control with data can be done three different ways: items from service, items from static list, and items from config option. You can choose between these options within the Item Lookup Mode within the Items Configuration option.
Forum Question – https://support.salientprocess.com/forums/topic/single-select/
Single Select Article – https://salientprocess.zendesk.com/hc/en-us/articles/206387757-Single-Select
Yes, SPARK has 4 separate controls that work with documents: BPM File DropZone, BPM File List, BPM File Uploader, and File Viewer. Documents can be attached using the File DropZone or File Uploader controls. Files uploaded can be added to a File List, and then be viewed within a File View.
Spark Controls – https://support.salientprocess.com/spark-ui-controls/
Document Video – https://youtu.be/SKz1C44Ktjk
Within the Date Picker control Configuration property under the Behavior drop-down, there are two options that provide out-of-the-box blacking out. Both blacking out all days before a particular start date, and blacking out all days after a particular end date can be applied.
Date Picker Blackout Dates Video – https://youtu.be/IjIIXk1sRCI
Date Picker Article – https://salientprocess.zendesk.com/hc/en-us/articles/205667108-Date-Picker
The Service Call control provides the ability to use AJAX services client side. The-AJAX services can run on load or explicitly executed using the execute(Optional_Input) method from any SPARK control’s inline event handlers.
How to use Service Call Article – https://salientprocess.zendesk.com/hc/en-us/articles/215590277-Using-the-Service-Call
Yes, all SPARK controls are responsive and “mobile ready”. You can customize the style to your form factor by using the Page Layout/Row/Cell controls or the Responsive Sensor control. How content is laid out can be specifically defined for various sized devices. For example, Horizontal Sections can be changed to Vertical Sections at specific screen widths you define using the Responsive Sensor.
Control Article/JS Doc List – https://support.salientprocess.com/spark-ui-controls/
Responsive Video – https://youtu.be/ESlK9KfVCg8