Java Doc for AddRemoveBase.java in  » IDE-Netbeans » visualweb.api.designer » com » sun » rave » web » ui » component » Java Source Code / Java DocumentationJava Source Code and Java Documentation

header  

footer

Facets

• addButton: Use this facet to replace the standard "Add" button. If you use a facet to replace this component, the JSF ID of this component should be the ID given to the AddRemove component with _addButton appended at the end. If you wish to use the JavaScript function associated with the default button, use the add() function. See the section on JavaScript for details.
• removeButton: Use this facet to replace the standard "Remove" button. If you use a facet to replace this component, the JSF ID of this component should be the ID given to the AddRemove component with _removeButton appended at the end. If you wish to use the JavaScript function associated with the default button, use the remove() function. See the section on JavaScript for details.
• addAllButton: Use this facet to replace the standard "Add All" button. If you use a facet to replace this component, the JSF ID of this component should be the ID given to the AddRemove component with _addAllButton appended at the end. If you wish to use the JavaScript function associated with the default button, use the addAll() function. See the section on JavaScript for details.
• removeAllButton: Use this facet to replace the standard "Remove All" button. If you use a facet to replace this component, the JSF ID of this component should be the ID given to the AddRemove component with _removeAllButton appended at the end. If you wish to use the JavaScript function associated with the default button, use the removeAll() function. See the section on JavaScript for details.
• moveUpButton: Use this facet to replace the standard "Move Up" button. If you use a facet to replace this component, the JSF ID of this component should be the ID given to the AddRemove component with _moveUpButton appended at the end. If you wish to use the JavaScript function associated with the default button, use the moveUp() function. See the section on JavaScript for details.
• moveDownButton: Use this facet to replace the standard "Move Down" button. If you use a facet to replace this component, the JSF ID of this component should be the ID given to the AddRemove component with _moveDownButton appended at the end. If you wish to use the JavaScript function associated with the default button, use the moveDown() function. See the section on JavaScript for details.
• header: Use this facet to create a header for the component. The facet will replace the component label.
• footer: Use this facet to create a footer for the component.

Client-side JavaScript functions

When the component is rendered, a JavaScript object corresponding to the component is created. The name of the variable is AddRemove_ followed by the component's DOM id where the colons have been replaced by underscores. For example, if the id of the component is listform:addremove then the JavaScript variable name will be AddRemove_listform_addremove. To manipulate the component on the client side, you may invoke functions on the JavaScript object. With reference to the id above, to add all elements on the available list that the user has selected, invoke AddRemove_listform_addremove.add().

• add(): the highlighted items on the available list are moved to the selected list.
• addAll(): all non-disabled items on the available list are moved to the selected list.
• remove(): the highlighted items on the selected list are moved to the available list.
• removeAll(): all non-disabled items on the selected list are moved to the available list.
• moveUp(): the highlighted items on the selected list are moved up one position.
• moveDown(): the highlighted items on the selected list are moved down one position.
• updateButtons(): this function ensures that the buttons are enabled/disabled based on the current selections in the lists. Invoke this function if you programmatically modify the selections on the available or selected list using client-side scripts. You do not need to invoke it when using any of the functions listed above, as they already invoke this function at the end.

Configuring the AddRemove tag

Examples

The component gets the options from a managed bean called AirportBean. The selections are stored in another managed bean (AirportSelectionBean). The selectAll attribute indicates that the Add All and Remove All buttons should be shown. A label for the component as a whole (label) is shown next to the component (labelOnTop is false). Labels have been specified for the list of available items and for the list of selected items. The sorted attribute indicates that the options on the list will be shown in alphabetical order.

 <ui:addRemove id="list"
 items="#{AirportBean.airports}"
 selected="#{AirportSelectionBean.airportSel}"
 label="Select airports"
 availableItemsLabel="Available Airports"
 selectedItemsLabel="Selected Airports"
 selectAll="true"
 sorted="true"
 labelOnTop="false"/>
 

As in the previous example, with the following exceptions: The component is rendered using vertical layout (in this case, the main component label is always rendered above the component). The moveButtons attribute indicates that the Move Up and Move Down buttons should be shown.

 
 <ui:addRemove id="list"
 items="#{AirportBean.airports}"
 selected="#{AirportSelectionBean.airportSel}"
 label="Select some names"
 availableItemsLabel="Available Names"
 selectedItemsLabel="Selected Names"
 selectAll="true"
 moveButtons="true"
 vertical="true"/>
 

Auto-generated component class. Do NOT modify; all changes will be lost!