1 / 12

Binding UI Components to Data

Binding UI Components to Data. Adding UI Components to the Page. You can create components on a page by: • Dragging a component from the Component Palette • Using the context menu in editor or Structure window • Dragging a data element from the Data Controls panel.

bonner
Download Presentation

Binding UI Components to Data

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Binding UI Components to Data

  2. Adding UI Components to the Page You can create components on a page by: • Dragging a component from the Component Palette • Using the context menu in editor or Structure window • Dragging a data element from the Data Controls panel

  3. Using the Component Palette • Drag the component from the Component Palette:

  4. Using the Context Menu

  5. Using the Data Controls Panel The Data Controls panel: • Is a visual representation of your business service that contains: – Methods – Parameters and results – Attributes – Collections – Built-in operations • Provides automatic data binding for any business service; for example, there automatically is a data control for every ADF BC application module

  6. Describing the ADF Model Layer • Data controls describe the public interface of a business service. • Bindings connect UI components to data or actions. • Data controls and bindings are defined by using XML metadata.

  7. Types of Data Bindings • Iterator Binding: Keeps track of the current row in a data collection • Value Binding: Connects UI components to attributes in a data collection; examples: attribute binding, tree binding, list binding, table binding • Action Binding: Invokes a method or operation

  8. Using Expression Language (EL)

  9. Expression Language and Bindings • Data binding expressions are written using EL. • They are evaluated at run time to determine what data to display. • ADF EL expressions typically have the form: #{bindingVariable.BindingObject.propertyName} – Example of an inputText component in a JSF page: <af:inputText value="#{bindings.Ename.inputValue}” label="#{bindings.Ename.label}” required="#{bindings.Ename.mandatory}">

  10. Opening a Page Definition File The page definition file <pagename>PageDef.xml (for example, browseOrdersPageDef.xml): • Is created automatically when you add a databound component to a page • Contains all the binding definitions for a page To open a page definition, perform the following steps: • Right-click the page in the editor or Application Navigator. 2. Select Go to Page Definition.

  11. Editing Bindings in a Page Definition File

  12. Tracing Data Binding:From Database to Databound Components

More Related