Using SPARK In Client Side Scripts

This example will show you how you can use client side scripts in client-side human services with SPARK.

For information on the difference between human services and client-side human services, click here.

This example shows what is possible with SPARK and client-side scripts and is by no means a best practice.


First, create a Client-Side Human Service.

Click the plus (+) button next to User Interface and select Client-Side Human Service.


Next, name your Client-Side Human Service.


Once you click Finish you will be taken to the web designer in your browser.

This is a simple example with a Text control with some validation.

On the coach there is:

There is also a Modal Alert under Hidden Items.


Within the Events of the Text control, there is some inline logic:

ValidateText1 is the cotnrolId for the Navigation Event control.


The On Load and On Change events will fire the Navigation Event when the Text control has text in it.  The On Input event will fire the Navigation Event when the user in typing in the Text control (The potential context variable contains the text you are attempting to enter).

On the Diagram there are two Client-side scripts with Stay-on page intermediate events.

The Validate Input Client-side script will validate that there is text in the Text control.

The end state binding to the Validate Input Client-side script is bound to the Navigation Event (Validate Text 1 is the Label for the Navigation Event).

Once the Text control is valid, the Say Hello button (Control Id is SayHelloButton and the Label is Say Hello) will become enabled, and when clicked the Modal Alert will appear.


The result at runtime...

When the page loads, we see that there is an error on the Text control and that the Say Hello button is disabled, this is because we have logic in the Text control to fire the Navigation Event on load, and since on load there is no text, there is a validation error.

When there is text in the Text control the validation error is gone, and the Say Hello button is enabled.

When the Say Hello button is clicked, the Modal Alert appears.


  • Author: Courtney Silva
  • Date Created: April 7, 2016
  • Date Modified: April 7, 2016
Was this article helpful?
0 out of 0 found this helpful