How to Create a Form

3-6 Java EE Developers Guide for Oracle Application Development Framework Example 3–4 JSF Page Code for an Attribute Dropped as an Input Text wLabel af:inputText value={bindings.address1.inputValue} label={bindings.address1.hints.label} required={bindings.address1.hints.mandatory} columns={bindings.address1.hints.displayWidth} maximumLength={bindings.address1.hints.precision} shortDesc={bindings.address1.hints.tooltip} id=it1 f:validator binding={bindings.address1.validator} af:inputText You can change any of these values to suit your needs. For example, the isNotNull control hint on the structure file is set to false by default, which means that the required attribute on the component will evaluate to false as well. You can override this value by setting the required attribute on the component to true. If you decide that all instances of the attribute should be mandatory, then you can change the control hint in the structure file, and all instances will be required. For more information about these properties, see Section 2.3.2, What Happens When You Use the Data Controls Panel to Create UI Components.

3.3 Creating a Basic Form

Instead of dropping each of the individual attributes of a collection to create a form, you can create a complete form that displays or collects data for all the attributes on an object. For example, the form on the Edit Suppliers Details page was created by dropping the productFindAll accessor collection from the Data Controls panel. You can also create forms that provide more functionality than simply displaying data from a collection. For information about creating a form that allows a user to update data, see Section 3.6, Creating a Form to Edit an Existing Record. For information about creating forms that allow users to create a new object for the collection, see Section 3.7, Creating an Input Form. You can also create search forms. For more information, see Chapter 7, Creating Databound Search Forms.

3.3.1 How to Create a Form

To create a form using a data control, you bind the UI components to the attributes on the corresponding object in the data control. JDeveloper allows you to do this declaratively by dragging and dropping a returned collection from the Data Controls panel. To create a basic form: 1. From the Data Controls panel, select the collection that returns the data you wish to display. Figure 3–3 shows the productFindAll accessor returned collection. Figure 3–3 productFindAll Accessor in the Data Controls Panel Creating a Basic Databound Page 3-7 2. Drag the collection onto the page, and from the context menu choose the type of form that will be used to display or collect data for the object. For a form, you are given the following choices: – ADF Form : Launches the Edit Form Fields dialog that allows you to select individual attributes instead of having JDeveloper create a field for every attribute by default. It also allows you to select the label and UI component used for each attribute. By default, ADF inputText components are used for most attributes. Each inputText component has the label attribute populated. Attributes that are dates use the InputDate component. Additionally, if a control hint has been created for an attribute, or if the attribute has been configured to be a list, then the component set by the hint is used instead. InputText components contain a validator tag that allows you to set up validation for the attribute, and if the attribute is a number or a date, a converter is also included. – ADF Read-Only Form : Same as the ADF Form, but read-only outputText components are used. Since the form is meant to display data, no validator tags are added converters are included. Attributes of type Date use the outputText component when in a read-only form. All components are placed inside panelLabelAndMessage components, which have the label attribute populated. The panelLabelAndMessage components are placed inside a panelFormLayout component. – ADF Dynamic Form : Creates a form whose bindings are determined at runtime. For more information, see Section 3.8, Using a Dynamic Form to Determine Data to Display at Runtime. 3. In the Edit Form Fields dialog, configure your form. You can elect to include navigational controls that allow users to navigate through all the data objects in the collection. For more information, see Section 3.4, Incorporating Range Navigation into Forms. You can also include a Submit button used to submit the form. This button submits the HTML form and applies the data in the form to the bindings as part of the JSFADF page lifecycle. For additional help in using the dialog, click Help. All UI components are placed inside a panelFormLayout component. 4. If you are building a form that allows users to update data, you now need to drag and drop a method that will perform the update. For more information, see Section 3.6, Creating a Form to Edit an Existing Record.

3.3.2 What Happens When You Create a Form