2.9 Understanding How Components Reference Bindings via EL

As you perform drag-and-drop data binding operations, JDeveloper creates the required ADF Model binding metadata in the page definition file and creates tags representing the JSF UI components you've requested. Importantly, it also ties the two together by configuring various properties on the components to have EL expression values that reference the bindings. Figure 2-27 summarizes how the page's UI components reference the bindings in its page definition. At runtime, these bindings are contained in a binding container related to the page.

Figure 2-27 EL Expressions Relate UI Components in a Page to Bindings

As a simple example, take the (Previous) button. When you drop this built-in operation as a button, an action binding named Previous is created in the page definition file, and two properties of the commandButton component are set:

• actionListener="#{bindings.Previous.execute}"

• disabled="#{!bindings.Previous.enabled}"

The first EL expression "wires" the button to execute the action binding named Previous in the binding container bound to the built-in Previous operation of the related data collection. The second EL expression automatically disables the button when the Previous operation does not make sense, such as when the user has navigated to the first row in the data collection.

Studying another example in the page, like the read-only outputText field that displays the user's email address and the panelLabelAndMessage component that contains it, you would see that JDeveloper sets up the following properties on these components to refer to the Email value binding:

• value="#{bindings.Email.inputValue}"

  on the outputText component

• label="#{bindings.Email.label}"

  on panelLabelAndMessage component

The combination of these settings "wires" the outputText component to pull its value from the Email binding, and the panelLabelAndMessage component to use the Email binding's label property as a display label. Since you configured UI controls hints for the attributes of your entity objects in the business domain layer, the control hints are inherited by the view object's attributes. The bindings expose this information at runtime so that components can easily refer to the control hints, such as labels and format masks using EL expressions.

The drag-and-drop data binding just completed did not account for how the current record display (for example "N of M") appeared on the page. To create it, you will need to reference properties for:

• The current range of visible rows

• The starting row in the range

• The total number of rows in the collection

Since the bindings expose properties for these, it is easy to create a current record display like this. Just drop three outputText components from the Component Palette and set each component's value attribute to an appropriate EL expression. The first one needs to show the current row number in the range of results from the Technicians data collection, so set its value attribute to an EL expression that references the (zero-based) rangeStart property on the TechniciansIterator binding.

#{bindings.TechniciansIterator.rangeStart + 1}

The second outputText component just needs to show the word "of", so setting its value property to the constant string "of" will suffice. The third outputText component needs to show the total number of rows in the collection. Here, make a reference to the iterator binding's estimatedRowCount property:

#{bindings.TechniciansIterator.estimatedRowCount}