Below are some examples on the different ways to use validation with SPARK.
Example 1
This example shows how validation can be applied in the Events section of a control.
The setValid method is used on the Submit button's On Click event
The setValid method recevies false as its first argument because the length of the Text control (Control Id is Text1) is 0, which causes a validation error rendering of the Text control, showing the "Enter some text!" tooltip.
The returning statement checks on the last valid state of the Text control with isValid, which is false for the Text control, resulting in a logical false which in turn prevents the button from triggering the boundary event.
Inline logic for readability:
${Text1}.setValid(${Text1}.getText().length > 0, "Enter some text!"); return ${Text1}.isValid();
At runtime...
If the Submit button is clicked without any text in the Text control, the error tooltip is displayed.
Example 2
This example shows how a validation function can be created in a Custom HTML.
The function can then be referenced in the events section of the Submit button.
At runtime it is the same as example 1.
Example 3
Client side and server side validation can be used concurrently.
For server side validation use a Server Script and a Stay On Page Event.
The Text control is bound to a variable.
Server Script for readability:
tw.system.coachValidation = new tw.object.CoachValidation();
tw.system.coachValidation.validationErrors = new tw.object.listOf.CoachValidationError();
if (tw.local.validateText == "") {
tw.system.addCoachValidationError (tw.system.coachValidation, "tw.local.validateText", "Enter some text! (Server Side)");
}
For client side validation, there is inline logic in the On Blur event of the Text control.
At runtime...
When the Submit button is clicked, the server side validation is triggered.
Since the client side validation is in the On Blur event, it gets triggered when the user clicks into the Text control, then clicks outside of the Text control (loses focus), and clicks the Submit button.
For more information on the methods that are available for each control, please visit the one page reference located here where you can find the link to the JS Doc.
- Author: Courtney Silva
- Date Created: November 12, 2015
- Date Modified: November 12, 2015
Comments