How to Add an inputColor Component

Using Input Components and Defining Forms 9-17

4. Expand the Behavior section and set ChooseId. Specify the id of the chooseDate

component which can be used to choose the date value. If not set, the inputDate component has its own default popup dialog with a chooseDate component. 5. If you want the value of the component to appear as read-only until the user hovers over it, expand the Other section and set Editable to onAccess. If you want the component to always appear editable, select always. If you want the value to be inherited from an ancestor component, select inherit.

9.5.3 What You May Need to Know About Selecting Time Zones Without the inputDate Component

By default, the inputDate component displays a drop down list of time zones if the associated converter is configured to do so, for example, if you include the timezone placeholder z in the converter’s pattern. The end user can only modify the timezone using this list. The list is configured to display the most common time zones. However, there may be times when you need to display the list of time zones outside of the inputDate component. For example, on a Application Preferences page, you may want to use a selectOneChoice component that allows the user to select the time zone that will be used to display all inputDates in the application. A backing bean would handle the conversion between the time zone ID and the java.util.TimeZone object. Converters for the inputDate instances in the application would then bind the time zone to that time zone object. You can access this list using either an API on the DateTimeUtils class, or using an EL expression on a component. Following are the methods on DateTimeUtils class: ■ getCommonTimeZoneSelectItems : Returns a list of commonly used time zones. ■ getCommonTimeZoneSelectItems String timeZoneId: Returns a list of commonly used time zones, including the given time zone if it is not part of the list. To access this list using EL, use one of the following expressions: ■ af:getCommonTimeZoneSelectItems For example: f:selectItems value={af:getCommonTimeZoneSelectItems} id=tzones2 ■ af:getMergedTimeZoneSelectItems id For example: f:selectItems value={af:getMergedTimeZoneSelectItemsdemoInput.preferredTimeZoneId} id=tzones If you will be using an inputDate component and a selection list for its time zone on the same page, you must clear out the local value for the inputDates timezone to ensure that the value binding for the selection takes precedence. Otherwise, a non-null Note: If you select inherit, and no ancestor components define the editable value, then the value always is used. 9-18 Web User Interface Developers Guide for Oracle Application Development Framework local value will take precedence, and the inputDate component will not appear to be updated. In Example 9–4 , the backing bean has a reference using the binding attribute to the inputDate component. When the user picks a new time zone, the id is set and the code gets the converter for the inputDate and clears out its time zone. When the page is rendered, since the local value for the converters time zone is null, it will evaluate {demoInput.preferredTimeZone} and obtain the updated time zone. Example 9–4 Using an inputDate and Time Zone Selection List Together af:selectOneChoice label=Select a new timezone value={demoInput.preferredTimeZoneId} autoSubmit=true f:selectItems value={af:getMergedTimeZoneSelectItemsdemoInput.preferredTimeZoneId} id=tzones af:selectOneChoice af:inputDate label=First inputDate with timezone bound id=bound1 partialTriggers=tzpick binding={demoInput.boundDate1} af:convertDateTime type=both timeStyle=full timeZone={demoInput.preferredTimeZone} af:inputDate DemoInputBean.java public void setPreferredTimeZoneIdString _preferredTimeZoneId { TimeZone tz = TimeZone.getTimeZone_preferredTimeZoneId; setPreferredTimeZone tz; this._preferredTimeZoneId = _preferredTimeZoneId; } public void setPreferredTimeZoneTimeZone _preferredTimeZone { this._preferredTimeZone = _preferredTimeZone; DateTimeConverter conv1 = DateTimeConverter _boundDate1.getConverter; conv1.setTimeZonenull; }

9.6 Using Selection Components

The selection components allow the user to select single and multiple values from a list or group of items. ADF Faces provides a number of different selection components, ranging from simple boolean radio buttons to list boxes that allow the user to select multiple items. The list of items within a selection component is made up of a number of selectItem components All the selection components except the selectItem component delivers the ValueChangeEvent and AttributeChangeEvent events. The selectItem component only delivers the AttributeChangeEvent event. You must create a valueChangeListener handler or an attributeChangeListener handler, or both for them. The selectBooleanCheckbox component value must always be set to a boolean and not an object. It toggles between selected and unselected states, as shown in Figure 9–16 . Using Input Components and Defining Forms 9-19 Figure 9–16 selectBooleanCheckbox Component The selectBooleanRadio component displays a boolean choice, and must always be set to a boolean. Unlike the selectBooleanCheckbox component, the selectBooleanRadio component allows you to group selectBooleanRadio components together using the same group attribute. For example, say you have one boolean that determines whether or not a user is age 10 to 18 and another boolean that determines whether a user is age 19-100. As shown in Figure 9–17 , the two selectBooleanRadio components can be placed anywhere on the page, they do not have to be next to each other. As long as they share the same group value, they will have mutually exclusive selection, regardless of their physical placement on the page. Figure 9–17 selectBooleanRadio Component You use the selectOneRadio component to create a list of radio buttons from which the user can select a single value, as shown in Figure 9–18 . Figure 9–18 selectOneRadio Component You use the selectManyCheckbox component to create a list of checkboxes from which the user can select one or more values, as shown in Figure 9–19 . Figure 9–19 selectManyCheckbox Component The selectOneListbox component creates a component which allows the user to select a single value from a list of items displayed in a shaded box, as shown in Figure 9–20 . Tip: Each selectBooleanRadio component must be bound to a unique boolean.