Frontend Scripting with JEXL

JEXL (JavaScript Expression Language) enables dynamic behavior in tSM forms — such as showing/hiding fields, calculating default values, or enforcing validation rules — all without backend code.

It runs in the browser at runtime, and is used throughout forms and pages via the Form Designer.

What is JEXL Used For?

Use Case	Example
Conditional visibility	Hide a field if the user selects "B2C"
Default values	Set date field to "today + 1"
Custom validation	Ensure value falls within limits based on another field
Data transformation	Join two strings or check if an item exists in a list
Context-based filtering	Show only orders for the current customer

Where JEXL Can Be Used

You’ll see JEXL-enabled fields in the Form Designer with a toggle icon:

hidden, readonly, disabled
default value
validationMessages
config fields
Listing filters

Once toggled, you can insert single-line expressions in JEXL.

JEXL Syntax Basics

Only single-expression scripts (no multiline code)
Uses JS-style operators (+, ==, &&, ||, !)
Works with context variables and built-in functions
Evaluates to a value or true/false for boolean logic

Context Variables

Variable	Description
$context.form	The current form being edited/created
$context.entity	The current entity (on detail pages)
$context.user	Current user info (e.g., role, name)

Custom fields are always under .chars (e.g. $context.form.chars.priority)

Examples

1. Hide a Field When Segment is B2C

$context.form.customerSegment == 'B2C'

Used in config.hidden.

2. Set Default Date to Tomorrow

addTime($context.form.orderDate, 1, 'days')

Used in default for a date field.

3. Validate VIP Discount Range

($context.form.clientStatus == 'VIP') && 
($context.form.discountRate < 10 || $context.form.discountRate > 50)

Used in validationMessage → custom rule.

4. Check if List Contains a Value

includes($context.form.selectedItems, 'apple')

5. Dynamic Label or Message

"Hello " + $context.user.name

Used to personalize headers or tooltips.

Built-In Functions

Function	Description
addTime(date, 1, 'days')	Adds days/months/hours to a date
includes(array, value)	Checks if value exists in list
sum(a, b, c)	Adds numbers
isNullOrEmpty(value)	Validates if value is missing or empty
dateFormat(date, 'yyyy-MM-dd')	Formats date string output

A full list of functions is documented in the JEXL Function Reference

JEXL Debug Console

To test expressions in live forms:

Enable the debug console in your user settings
Open a form and click the JEXL debug icon
Use $context to explore live values
Test expressions with real-time feedback

Best Practices

Expressions must be single-line: no if/else blocks
Use descriptive field names (priorityLevel > prLvl1)
Combine logic with &&, ||, ternary (? :) when needed
Always test conditionals in runtime
Handle null or empty cases explicitly (isNullOrEmpty)