oracle® fusion middleware

Download Oracle® Fusion Middleware

Post on 27-Jan-2015




9 download

Embed Size (px)


Oracle® Fusion MiddlewareWeb User Interface Developer’s Guide for Oracle ApplicationDevelopment Framework11g Release 1 (11.1.1)B31973-02


elements are omitted). The visual contentsare inserted into the DOM on the client without leaving the current page. Thissubstitution can happen because the ADF Faces document component renders a

element inside the element. This
element surrounds all othercontent in the page. During PPR navigation, the contents of the original
element are simply replaced with the next pages
content.In order to keep track of location (for example, for bookmarking purposes, or when arefresh occurs), the framework makes use of the hash portion of the URL. This portionof the URL contains the actual page being displayed in the browser. 7.4.1 How to Enable PPR NavigationThe type of navigation used by an application is set in the web.xml file. By default,standard navigation is used. Add a context parameter in order to turn on PPRnavigation. To enable PPR navigation:1. Open the web.xml file. By default, this is located in the WEB-INF directory. 2. In the overview editor, expand the Context Initialization Parameters section and click the Add icon to add the new parameter.3. Enter as the Name.4. For Value, enter one of the following: on: PPR navigation is turned on for the application. off: PPR navigation is turned off for the application. onWithForcePPR: When an action on a command component results in navigation, the action will always be delivered using PPR, as if the component had the partialSubmit attribute set to true (for more information about partialSubmit, see Section 5.1.1, "Events and Partial Page Rendering"). Therefore, if the component already has partialSubmit set to true, the framework does nothing. Otherwise, the entire document is refreshed to ensure that old page refresh behavior is preserved. The entire document is also refreshed if the action component does not contain navigation.5. If you set the context parameter to on, set the partialSubmit attribute to true for any command components involved in navigation. 7.4.2 What You May Need to Know About PPR NavigationBefore using PPR navigation, you should be aware of the following:When using PPR navigation, all pages involved in navigation must use the same style sheets.Because PPR navigation makes use of the hash portion of the URL, you cannot use the hash portion for navigation to anchors within the page.The page being navigated to does not have to use the same JavaScript library as the previous page. However, the previous pages JavaScript will not be unloaded. Rerendering Partial Page Content 7-7 132. Partial Page Navigation 7-8 Web User Interface Developers Guide for Oracle Application Development Framework 133. Part III Using ADF Faces ComponentsPart III contains the following chapters: Chapter 8, "Organizing Content on Web Pages" Chapter 9, "Using Input Components and Defining Forms" Chapter 10, "Presenting Data in Tables and Trees" Chapter 11, "Using List-of-Values Components" Chapter 12, "Using Query Components" Chapter 13, "Using Popup Dialogs, Menus, and Windows" Chapter 14, "Using Menus, Toolbars, and Toolboxes" Chapter 15, "Presenting Data Using Output Components" Chapter 16, "Displaying Tips, Messages, and Help" Chapter 17, "Working with Navigation Components" Chapter 18, "Creating and Reusing Fragments, Templates, and Components" Chapter 19, "Customizing the Appearance Using Styles and Skins" Chapter 20, "Internationalizing and Localizing Pages" Chapter 21, "Developing Accessible ADF Faces Pages" 134. 8 Organizing Content on Web Pages This chapter describes how to use several of the ADF Faces layout components toorganize content on web pages.This chapter includes the following sections: Section 8.1, "Introduction to Organizing Content on Web Pages" Section 8.2, "Starting to Lay Out a Page" Section 8.3, "Arranging Contents to Stretch Across a Page" Section 8.4, "Using Splitters to Create Resizable Panes" Section 8.5, "Arranging Page Contents in Predefined Areas" Section 8.6, "Arranging Content in Forms" Section 8.7, "Displaying and Hiding Contents Dynamically" Section 8.8, "Displaying or Hiding Contents in Accordion Panels and TabbedPanels" Section 8.9, "Displaying Items in a Content Container" Section 8.10, "Displaying a Bulleted List in One or More Columns" Section 8.11, "Grouping Related Items" Section 8.12, "Separating Content Using Blank Space or Lines" 8.1 Introduction to Organizing Content on Web PagesADF Faces provides a number of layout components that can be used to arrange othercomponents on a page. Usually, you begin building your page with these components.You then add components that provide other functionality (for example renderingdata or rendering buttons) either inside facets or as child components to these layoutcomponents. Tip: You can create page templates that allow you to design thelayout of all pages in your application just once. The templates canthen be reused by the pages in your application. For moreinformation, see Chapter 18, "Creating and Reusing Fragments,Templates, and Components". In addition to layout components that simply act as containers, ADF Faces alsoprovides interactive layout components that can display or hide their content, or thatprovide sections, lists, or empty space. Some layout components also providegeometry management functionality, such as stretching their contents to fit theOrganizing Content on Web Pages 8-1 135. Introduction to Organizing Content on Web Pages browser windows as the window is resized, or the capability to be stretched when placed inside a component that stretches. For more information about stretching and other geometry management functionality of layout components, see Section 8.2.1, "Geometry Management and Component Stretching". Table 81 briefly describes each of the ADF Faces layout components.Table 81ADF Faces Layout Components Can StretchCan Be Component Description Children Stretched Page Management Components documentCreates each of the standard root X elements of an HTML page: , , and . All pages must contain this component. For more information, see Section 8.2, "Starting to Lay Out a Page". formCreates an HTML element. For more information, see Section 8.2, "Starting to Lay Out a Page". Page Layout Containers panelStretchLayout Contains top, bottom, start, XXcenter, and end facets where youcan place other components. Formore information, see Section 8.3,"Arranging Contents to StretchAcross a Page". panelSplitter Divides a region into two parts XX (first facet and second facet) with a repositionable divider between the two. You can place other components within the facets. For more information, see Section 8.4, "Using Splitters to Create Resizable Panes". panelBorderLayout Can have child components, which are placed in its center, and also contains 12 facets where additional components can be placed. These will surround the center. For more information, see Section 8.5, "Arranging Page Contents in Predefined Areas". panelFormLayout Positions input form controls, such as inputText components so that their labels and fields line up vertically. It supports multiple columns, and contains a footer facet. For more information, see Section 8.6, "Arranging Content in Forms". Components with Show/Hide Capabilities 8-2 Web User Interface Developers Guide for Oracle Application Development Framework 136. Introduction to Organizing Content on Web Pages Table 81 (Cont.) ADF Faces Layout Components Can StretchCan Be ComponentDescriptionChildren StretchedshowDetailHides or displays content through atoggle icon. For more information,see Section 8.7, "Displaying andHiding Contents Dynamically".showDetailHeaderCan hide or display contents belowthe header. Often used as a child tothe panelHeader component. Formore information, see Section 8.7,"Displaying and Hiding ContentsDynamically".panelBoxContains child components and canbe offset by color. Has a toolbarfacet. For more information, seeSection 8.7, "Displaying and HidingContents Dynamically"panelAccordionUsed in conjunction withXshowDetailItem components todisplay as a panel that can beexpanded or collapsed. For moreinformation, see Section 8.8,"Displaying or Hiding Contents inAccordion Panels and TabbedPanels".panelTabbed Used in conjunction withXshowDetailItem components todisplay as a set of tabbed panels. Formore information, see Section 8.8,"Displaying or Hiding Contents inAccordion Panels and TabbedPanels".showDetailItemUsed to hold the content for the X (if itdifferent panes of the containspanelAccordion or different tabs a singleof the panelTabbed component.childFor more information, seecompon-Section 8.8, "Displaying or Hiding ent)Contents in Accordion Panels andTabbed Panels". Miscellaneous ContainerspanelHeader Contains child components andprovides a header that can includemessages, toolbars, and help topics.For more information, seeSection 8.9, "Displaying Items in aContent Container".panelList Renders each child component as alist item and renders a bullet next toit. Can be nested to createhierarchical lists. For moreinformation, see Section 8.10,"Displaying a Bulleted List in One orMore Columns"inlineFrame Creates an inline frame tag.X Organizing Content on Web Pages8-3 137. Starting to Lay Out a Page Table 81 (Cont.) ADF Faces Layout Components Can StretchCan Be Component Description Children StretchednavigationPane Creates a series of navigation items X (if representing one level in aconfigured navigation hierarchy. For more to display information, see Section 17.3, "Usingtabs) Navigation Items for a Page Hierarchy"panelCollectionUsed in conjunction with collection X (only a X components such as table, treesingle and treeTable to provide menus, table, toolbars, and status bars for those tree, or components. For more information, tree table) see Section 10.8, "Displaying Table Menus, Toolbars, and Status Bars".panelWindowDisplays child components inside a popup window. For more information, see Section 13.2, "Creatin

View more >