You can drag the Drop Down List component
from
the Palette to the Visual Designer to create a Drop Down List (or combo
box) that enables the user to click a drop button and select
items from a list.
A Drop Down List is a list of items that initially displays as a single item and, when clicked, drops down into a list of multiple items. Only one item can be selected at a time. Drop Down Lists are similar to combo boxes in Java Swing and in Microsoft Windows, and are called select lists in HTML.
You can set the items
property to associate the component either with a database table or with an array, a java.util.Collection
, or a java.util.Map
of com.sun.rave.web.ui.model.Option
objects to populate the list. Right-click the component and choose Bind to Data to set this property. In the Navigator window, you can see the default object that populates the list, which has a name similar to dropDown1DefaultOptions
. For information on the default setting for this property, see
Default Display of Drop Down Items later in this topic.
You use the selected
property to associate the component with a model object that represents the current choice, by setting the value to an expression that corresponds to a property of a managed bean. You can right-click the component and choose Property Bindings to bind the selected
property.
The first time the component is rendered, the option that corresponds to the value of the selected
model object property is marked as selected by using the equals method on the model object.
Here are some things you can do with the component:
Option
objects, you can assign OptionGroup
objects to create separated groups of options.label
property.
label
property is not as flexible as the Label component. You can use the Label component if you want more control over the label's appearance, such as positioning of the label relative to the component.validate
method so you can insert code to validate the value of the component.processValueChange
method so you can insert code that executes when the value of this component changes. This method executes when you have selected Auto-Submit on Change from the component's pop-up menu, which submits the page when the value of the component changes. This technique is useful if the component is part of a virtual form.common_timeoutSubmitForm(this.form, 'component-id');
. At runtime, this code causes the form to be automatically submitted if the user changes the component value. Once the form is submitted, conversion and validation occur on the server and any value change listener methods execute, and then the page is redisplayed.
If you have code you want to execute when the page is submitted, put it in the processValueChange
method described above.
A component configured to Auto-Submit on Change can use virtual forms to limit the input fields that are processed when the form is submitted. If the auto-submit component is defined to submit a virtual form, only the participants in that virtual form will be processed when the auto-submit occurs.
items
property to an object or to a data provider, as described in Bind to Data Dialog Box.
items
property to an object, select the Bind to Object tab and then select a bean property that will be used to populate the list. The bean property must be an Object
array, map, or collection whose members are all subclasses of com.sun.rave.web.ui.model.Option
.
items
property to a data provider for a database table, web service, or enterprise bean to be used to populate the list, select the Bind to Data Provider tab and choose a data provider.selected
property, which you can bind to an Object
array, array of primitives, or ArrayList
. You must have added the array to a managed bean, such as the session bean, as a property. You can use this bean property to evaluate what the user chose after the page is submitted.dropDown#DefaultOptions
object and change the list items' display and values and pick the item that is selected by default when the drop down list first displays. It is likely that you will instead bind the items
property to a database or object to use to set list items, as described above under Bind to Data. By default, a Drop Down List displays its list items by using an object of type SingleSelectOptionsList
with a name based on the default component ID. For example, the first drop down list you drop on a page is initially named dropDown1
and has an associated dropDown1DefaultOptions
array object associated with it that you can see in the Navigator window.
You can set the values of this array object by right-clicking the drop down list component and choosing Configure Default Options to open the Options Customizer dialog box. In this dialog box you can add new items or delete existing ones, and for each item you can set the displayed value (Display) and the value of the item (Value), and you can select which item is displayed by default (Selected). The dropDown#DefaultOptions
object is an array that stores its Display values in label
fields and its Value values in value
fields.
The following code sample shows how you might use this object and the select
property of the drop down list to determine which item is currently selected, and then write its Display and Value values, its label
and value
, to two static text fields for display. If you add a drop down list and two static text components to the page, and then put this code in the drop down list's processValueChange
method as described above and select Auto-Submit on Change for the component, when the user selects an item in the list, its Display and Value values display in the two static text fields.
String myvalue = (String)dropDown1.getSelected();
int numOptions = dropDown1DefaultOptions.getOptions().length;
int i = 0;
for (i = 0; i < numOptions; i++) {
if (myvalue.equals(dropDown1DefaultOptions.getOptions()[i].getValue()))
break;
}
if (i < numOptions) {
staticText1.setText(dropDown1DefaultOptions.getOptions()[i].getLabel());
staticText2.setText(dropDown1DefaultOptions.getOptions()[i].getValue());
} else {
staticText1.setText("not found"); // should not get here
}