What You May Need to Know About Disclosure Events

Organizing Content on Web Pages 8-55 Figure 8–37 Panes Can Be Reordered by Dragging and Dropping When the order is changed, the displayIndex attribute on the showDetailItem components also changes to reflect the new order. To use the panelAccordion component, see Section 8.9.1, How to Use the panelAccordion Component. The panelTabbed component creates a series of tabbed panes. Unlike the panelAccordion panes, the panelTabbed panes are not collapsible or expandable. Instead, when users select a tab, the contents of the selected tab are displayed. The tabs may be positioned above the display area, below the display area, or both. You can configure a panelTabbed component so that the individual tabs can be closed. You can have it so that all tabs can be closed, all but the last tab can be closed, or no tabs can be closed. When tabs are configured to be closed, an X is displayed at the end of the tab. You can also configure tabs so that they display a disabled X, meaning it can be closed, but is currently disabled. You can configure when the showDetailItem components that contain the contents for each of the tabs will be created. When you have a small number of tabs, you can have all the showDetailItem components created when the panelTabbed component is first created, regardless of which tab is currently displayed. However, if the panelTabbed component contains a large number of showDetailItem components, the page might be slow to render. To enhance performance, you can instead configure the panelTabbed component to create a showDetailItem component only when its corresponding tab is selected. You can further configure the delivery method to either destroy a showDetailItem once the user selects a different Note: Items in the overflow cannot be reordered. 8-56 Web User Interface Developers Guide for Oracle Application Development Framework tab, or to keep any selected showDetailItem components in the component tree so that they do not need to be recreated each time they are accessed. The File Explorer application uses the panelTabbed component to display the contents in the main panel, as shown in Figure 8–38 . Figure 8–38 panelTabbed Panes To use the panelTabbed component, see Section 8.9.2, How to Use the panelTabbed Component. For both the panelAccordion and panelTabbed components, use one showDetailItem component to provide the contents for each panel. For example, if you want to use four panes, insert four showDetailItem components inside the panelAccordion or panelTabbed components, respectively. To use the showDetailItem component, see Section 8.9.3, How to Use the showDetailItem Component to Display Content in panelAccordion or panelTabbed Components. You can add a toolbar to the toolbar facet of the showDetailItem component, and the toolbar will be shown whenever the panel or tab is disclosed. Figure 8–38 shows the toolbar used by the showDetailItem component in the File Explorer application. The panelTabbed component also supports an overflow icon if all tabs cannot be displayed. Figure 8–39 shows the overflow icon in the File Explorer application. Figure 8–39 Overflow Icon in panelTabbed Component Tip: If you want the tabs to be used in conjunction with navigational hierarchy, for example, each tab is a different page or region that contains another set of navigation items, you may want to use a navigation panel component to create a navigational menu. For more information, see Section 18.5, Using Navigation Items for a Page Hierarchy. Performance Tip: The number of child components within a panelAccordion or panelTabbed component, and the complexity of the child components, will affect the performance of the overflow. Set the size of the panelAccordion or panelTabbed component to avoid overflow when possible.