Front-End Script Reference

Overview

The front-end script is the programming language used in the user interface designer (UI designer) to define a set of rules and the logic of the behavior of UI controls. For example, you can write a front-end script to enable an edit button only when a field is selected on the user interface. The front-end script must only be used for user interface related adaptation; it must not contain any business logic.

Front-end scripts are used in the following use cases:

Script Execution

All scripts (including calculation rules) are executed in a sequential manner together with all other events by the event queue processor in the UI runtime on the client. Parallel execution of scripts is not possible. For each execution of a script, the scripts environment is recreated. All variables, including global variables, are reset.

Note

Due to this execution strategy:

  • A large number of executing script instances (such as those triggered by the recalculation of properties) or slow scripts can cause the client to react slowly. This is because all scripts in the event queue are processed before event handler operations that are triggered by end user interaction.

  • Events that are triggered by a script — either directly or implicitly due to data manipulation — are also queued and processed only after the script has terminated.

End of the note

Syntax

The scripts are defined as part of a UI component model. The UI component models are stored and processed as XML files; the script sources are stored as character data sections within these UI component models. The character set of the scripts is based on UTF-8.

Each script and each block used inside control statements is a sequence of statements. For more information, see Lexical Structure of Front-End Scripts and Syntax of Front-End Scripts.

For more code samples, see Front-End Code Snippets.

Caution

Any software coding or code lines/strings (“Code”) provided in this documentation are only examples and are not intended for use in a productive system environment. The Code is only intended to better explain and visualize the syntax and phrasing rules for certain SAP coding. SAP does not warrant the correctness or completeness of the Code provided herein and SAP shall not be liable for errors or damages cause by use of the Code, except where such damages were caused by SAP with intent or with gross negligence.

End of the caution

Interacting with UI Runtime

The following figure provides an overview of the UI client runtime environment that the front-end script interacts with.

Client Controller Overview

Client Controller Overview

Interacting with Runtime Data

The interaction with runtime data is accomplished by accessing members of the global variable $data. For more information, see Interacting with Runtime Data.

Interacting with Runtime Component Controller

Each script is executed as an operation of an event handler and runs within the scope of the UI component controller. The global variable $controller provides information about UI component controller's state and methods to interact with the component controller. For more information, see Global Variable: $controller.

Using the Text Pool

Scripts should never contain any literals that are intended to be presented to the end user, because they cannot be translated. Texts for the end user should also never be created by concatenating variables or variables and literals, because the order of the elements may have to change in different languages. Instead, you should use modeled texts from the text pool of the UI component.