Data Binding of User Interface Element Properties 

The cooperation of UI elements and context elements is made possible by a mutual data binding. The view that contains the UI elements is bound against the context of the controller assigned to it. If a data binding of context element and UI element property is defined, the changes of the UI element property are directly transferred to the context and vice versa. These changes are also adopted by the properties of other UI elements of the same view if the are bound to the same context element. More complex UI elements – for example, the Table UI element or Tree UI element – can be bound to a context node that represents a collection. Therefore, these UI elements can display the complete data and content of the node.

By storing a reference to a context element, data can be passed directly from the context to the UI element and back. This reference is created by specifying an entry that is similar to a path – for example, MONTHSOFYEAR.MONTHNAME – as a value of a bindable UI element property. A period separates the individual context elements – for example, MONTHSOFYEAR.MONTHNAME.

The Web Dynpro Explorer provides graphical support of the context elements and allows application developers to assign the context nodes and context attributes to the corresponding UI element properties. This means that the data transport between the context element and the UI element does not require an explicit implementation.

Different Data Binding Approaches

There are different data binding concepts for the individual UI elements. The following general rules apply:

·        Data binding with identical or convertible data types

The type of the context attribute must be compatible to the property type. This means that the types must be either identical or the property of the UI element must be of the type String and convertible. In the latter case, the type of the context attribute (for example, InputField.value) does not matter.

·        Data binding of UI elements with dynamic or static character, respectively

For certain UI element properties it does not make sense to be bound to a related context - for example, properties that have a static character. This is why the ID of a UI element, which a label control refers to, cannot be bound to a context. However, the data source of a table UI element, which is usually created dynamically and also represents a structure, must be bound to a context.

·        Data binding of UI elements with a non-scalar character

Many properties of UI elements are not of a scalar character but resemble a collection of values. These elements are not bound to an individual root attribute but to the context attribute of a multiple node. A multiple node can be a dropdown list box, for example. Each element of the multiple node contains a different instance of the context attribute. Therefore, several elements appear in the selection list.

·        Data binding to a context node

There are also properties that refer to an entire node and not only to one of its attributes. This applies to the data source of a table: The elements of the bound node correspond to the table rows, its attributes to the columns.

Note that the IDs of the UI elements are not bound. The same applies to these properties that represent the names of an action and can be executed when an event occurs - for example, CheckBox.onToggle.

Certain properties, however, can be bound to any type of the context attribute if they are defined as convertible. They include:

·         InputField.value

·         Label.text

·         TextEdit.value

·         TextView.text

All other properties can only be bound to a context attribute of the same data type.