Dialog Variables

Dialog variables provide a quick and easy way to substitute text within a snippet or panel from your JavaScript code.

Certain dialog variable types provide additional modifiers that may be used to fine-tune output.

JavaScript API

The following methods may be used to set a dialog variable on a Panel:

  • Panel.SetDialogVariable(variable: string, value: string)

  • Panel.SetDialogVariableInt(variable: string, value: number)

  • Panel.SetDialogVariableFloat(variable: string, value: number)

  • Panel.SetDialogVariableTime(variable: string, value: number)

Formatting

Dialog variables are specified in layout files in the format {xy:myname}, where xy is a one or two character long format string, and myname is the name of your dialog variable.

There are two parts to the format string: the format and the modifier. The format character comes first and is required. The modifier character comes second and is optional, if supported.

String: s, S

Displays a formatted string.

Modifiers

Name Description
u Upper-case the string
l Lower-case the string
h HTML allowed in string

Examples

Use a dialog variable mytest in a Label:

<Label text="{s:mytest}"/>

Upper-case formatted string:

{su:myupperstring}

Time: t, T

Displays a formatted time.

Use with Panel.SetDialogVariableTime.

Modifiers

Name Description
s Short date
l Long date
t Short time
T Long time, with seconds
r Relative time
d Duration (i.e. 3 hours 40 minutes)
m Minutes
e Server real time

Examples

Time duration:

{td:myvar}

Long date:

{tl:mylongdate}

Currency: m, M

Displays a formatted currency.

Use with Panel.SetDialogVariableFloat.

Modifiers

None.

Examples

None.

Integers: i, I, d, D

Displays a formatted integer.

Use with Panel.SetDialogVariableInt.

Modifiers

Name Description
r Raw number

Examples

Simple integer format:

{d:myvar}

Raw integer format:

{ir:myvar}

Floating Point Numbers: f, F

Displays a formatted floating point number.

Use with Panel.SetDialogVariableFloat.

Modifiers

None.

Examples

Floating-point format:

{F:myfloat}

Also floating-point format:

{f:myfloat}

Unsigned 64-bit Integers: u, U

Displays a formatted uint64.

Use with Panel.SetDialogVariableInt.

Modifiers

None.

Examples

UInt64 format:

{u:myuint64}

Sample Code

The following example code demonstrates the usage of many different types of dialog variables.

<snippets> <snippet name="ExampleSnippet"> <Panel class="full flow-down"> <Label text="This is a float: {f:myfloat}"/> <Label text="This is a string: {s:mystring}"/> <Label text="This is an UPPER STRING: {su:myupperstring}"/> <Label text="This is a long date: {tl:mytime}" /> <Label text="This is an integer: {d:myint}" /> </Panel> </snippet> </snippets>
// Create a panel and load the snippet const panel = $.CreatePanel('Panel', null, 'test'); panel.LoadLayoutSnippet('ExampleSnippet'); // Set a bunch of dialog variables panel.SetDialogVariableFloat('myfloat', 32.32); panel.SetDialogVariable('mystring', 'Hello World!'); panel.SetDialogVariable('myupperstring', 'This text should be all caps'); panel.SetDialogVariableTime('mytime', 1); // January 1st, 1970 panel.SetDialogVariableInt('myint', -1);