How to Access Values from a Selection in Stamped Components.

11 Using List-of-Values Components 11-1 11 Using List-of-Values Components This chapter describes how to use a list-of-values component to display a model-driven list of objects from which a user can select a value. This chapter includes the following sections: ■ Section 11.1, Introduction to List-of-Values Components ■ Section 11.2, Creating the ListOfValues Data Model ■ Section 11.3, Using the inputListOfValues Component ■ Section 11.4, Using the InputComboboxListOfValues Component

11.1 Introduction to List-of-Values Components

ADF Faces provides two list-of-values LOV input components that can display multiple attributes of each list item and can optionally allow the user to search for the needed item. These LOV components are useful when a field used to populate an attribute for one object might actually be contained in a list of other objects, as with a foreign key relationship in a database. For example, suppose you have a form that allows the user to edit employee information. Instead of having a separate page where the user first has to find the employee record to edit, that search and select functionality can be built into the form, as shown in Figure 11–1 . Figure 11–1 List-of-Values Input Field In this form, the employee name field is an LOV that contains a list of employees. When the user clicks the search icon of the inputListOfValues component, a Search and Select popup dialog displays all employees, along with a search field that allows the user to search for the employee, as shown in Figure 11–2 . 11-2 Web User Interface Developers Guide for Oracle Application Development Framework Figure 11–2 The Search Popup Dialog for a List-of-Values Component When the user returns to the page, the current information for that employee is displayed in the form, as shown in Figure 11–3 . The user can then edit and save the data. Figure 11–3 Form Populated Using LOV Component Other list components, such as selectOneChoice, also allow users to select from a list, but they do not include a popup dialog and they are intended for smaller lists. This chapter describes only the inputListOfValues and inputComboboxListOfValues LOV components. For more information about select choice components, list box components, and radio buttons, see Chapter 9, Using Input Components and Defining Forms. As shown in the preceding figures, the inputListOfValues component provides a popup dialog from which the user can search for and select an item. The list is displayed in a table. In contrast, the inputComboboxListOfValues component allows the user two different ways to select an item to input: from a simple dropdown list, or by searching as you can in the inputListOfValues component. Note that the columns of the table will not stretch to the full width of the dialog. You can also create custom content to be rendered in the Search and Select dialog by using the searchContent facet. You define the returnPopupDataValue attribute Using List-of-Values Components 11-3 and programmatically set it with a value when the user selects an item from the Search and Select dialog and then closes the dialog. This value will be the return value from ReturnPopupEvent to the returnPopupListener. When you implement the returnPopupListener, you can perform functions such as setting the value of the LOV component, its dependent components, and displaying the custom content. In the searchContent facet you can add components such as tables, trees, and inputText to display your custom content. If you implement both the searchContent facet and the ListOfValues model, the searchContent facet implementation will take precedence in rendering the Search and Select dialog. Example 11–1 show the code to display custom content using a table component. Example 11–1 Adding Custom Content to the Search and Select Dialog af:inputListOfValues model={bean.listOfValuesModel} ... returnPopupDataValue={bean.returnPopupDataValue} returnPopupListener={bean.returnPopupListener} f:facet name=searchContent af:table id=t1 value={bean.listModel} var=row selectionListener={bean.selected} ... f:facet af:inputListOfValues If the readOnly attribute is set to true, the input field is disabled. If readOnly is set to false, then the editMode attribute determines which type of input is allowed. If editMode is set to select, the value can be entered only by selecting from the list. If editMode is set to input, then the value can also be entered by typing. You can also implement the LOV component to automatically display a list of suggested items when the user types in a partial value. For example, when the user enters Ca, then a suggested list which partially matches Ca is displayed as a suggested items list, as shown in Figure 11–4 . Figure 11–4 Suggested Items List for an LOV The user can select an item from this list to enter it into the input field, as shown in Figure 11–5 . Figure 11–5 Suggested Items Selected