How to use JavaScript Functions in Client-side Watch Expressions
Description
Client-side watch expressions can call a user defined JavaScript functions as part of the expression.
Discussion
When defining client-side watch expressions (e.g. show/hide, enable, client-side dynamic style, dynamic images), you can use user defined Javascript functions in the expression. Functions can be declared in the global namespace or inside a private namespace (e.g. as a "property" of an object, such as {grid.object} or {dialog.object}.)
You can use Javascript functions that are in your own namespace within the Grid or UX Component in client-side watch expressions.
Client-side watch expressions refers to the following client-side expressions for controls in a component:
- Show/hide Expression
- Enable expression
- Readonly expression
- Conditional style, class, text, and events
- Conditional Image definitions
Calling a Function in the Global Namespace
Suppose you have defined the following function in the Javascript Code section to use in a client-side enable expression for a new record button in a UX Component:
function enableNewRecordButton () {
if ({dialog.object}.isDirty()) {
return false;
}
return true;
}To use this function in the client-side enable expression for the button, the expression would be defined as follows:
enableNewRecordButton() = true
Calling a Function in a Private Namespace
To prevent function name collisions, it is beneficial to define JavaScript functions inside a namespace. For example, the following function is defined in the namespace of the {dialog.object} as a method of the {dialog.object}'s _functions property:
{dialog.object}._functions.myfunction = function() {
return true;
}The function, {dialog.object}._functions.myfunction can be used in a client-side watch expression. For example, the example below demonstrates how you would write a client-side show/hide expression that calls [js:{dialog.object}._functions.myfunction]*:
{dialog.object}._functions.myfunction() = true