How to Bind to the XMLMenuModel in the JSF Page

18-26 Web User Interface Developers Guide for Oracle Application Development Framework

5. In the Property Inspector, expand the Data section. Set the value attribute to the

menu model managed bean that is configured for the root XMLMenuModel class in the faces-config.xml file. 6. Set the var attribute to text that you will use in the commandNavigationItem components to get the needed data from the menu model. As the hierarchy is created at runtime, and each node is stamped, the data for the current node is copied into the var attribute, which can then be addressed using an EL expression. You specify the name to use for this property in the EL expression using the var property.

7. Drag and drop a Navigation Item from the Component Palette to the nodeStamp

facet of the navigationPane component. 8. Set the values for the remaining attributes that have corresponding values in the metadata using EL expressions that refer to the menu model whose metadata contains that information. You access these values using the value of the var attribute you set for the parent navigationPane component in Step 6 along with the name of the corresponding itemNode element that holds the value in the metadata. Table 18–5 shows the attributes on the navigation item that has corresponding values in the metadata. For example, if you had set the var attribute on the parent navigationPane component to menuNode, you would use {menuNode.doAction} as the EL expression for the value of the action attribute. This would resolve to the action property set in the metadata for each node. Example 18–13 shows the JSF code for binding to a menu model for the HR example. Note: The value attribute can reference root menu models and menu models referenced by shared nodes. If you reference a shared node in the value attribute, the faces-config.xml file needs to have a new managed bean entry with a different managed bean name than the one which is used in a root menu model definition in the menu model metadata file. This promotes the menu model of a shared node to a root menu model which can then be referred to in the value attribute. Tip: You use the same value for the var attribute for every navigationPane component on the page or in the application. Table 18–5 Navigation Item Attributes and the Associated Menu Model Attributes Navigation Item Attribute Associated Menu Model Element Attribute text label action doAction icon icon destination destination visible visible rendered rendered Working with Navigation Components 18-27 Example 18–13 Binding to the XML Model af:form af:navigationPane hint=buttons level=0 value={root_menu} var=menuNode f:facet name=nodeStamp af:commandNavigationItem text={menuNode.label} action={menuNode.doAction} icon={menuNode.icon} destination={menuNode.destination} f:facet af:navigationPane af:navigationPane hint=tabs level=1 value={root_menu} var=menuNode f:facet name=nodeStamp af:commandNavigationItem text={menuNode.label} action={menuNode.doAction} icon={menuNode.icon} destination={menuNode.destination} f:facet af:navigationPane af:navigationPane hint=bar level=2 value={root_menu} var=menuNode f:facet name=nodeStamp af:commandNavigationItem text={menuNode.label} action={menuNode.doAction} icon={menuNode.icon} destination={menuNode.destination} f:facet af:navigationPane af:navigationPane hint=list level=3 value={root_menu} var=menuNode f:facet name=nodeStamp af:commandNavigationItem text={menuNode.label} action={menuNode.doAction} icon={menuNode.icon} destination={menuNode.destination} f:facet af:navigationPane af:form

18.6.4 How to Use the breadCrumbs Component

Creating a breadcrumb using the menu model is similar to creating the page hierarchy; you use the breadCrumbs component with a nodeStamp facet that stamps a commandNavigationItem component with data from the model. To create a breadcrumb: 1. Create a breadCrumbs component by dragging and dropping a Bread Crumbs component from the Component Palette to the JSF page. 2. By default, breadcrumb links are displayed in a horizontal line. To change the layout to be vertical, in the Property Inspector, expand the Common section and set the orientation attribute to vertical.

3. In the Property Inspector, expand the Data section. Set the value attribute to the

root menu model managed bean as configured in the faces-config.xml file. This is the same bean to which the navigationPane component is bound. 18-28 Web User Interface Developers Guide for Oracle Application Development Framework 4. Set the var attribute to text that you will use in the commandNavigationItem components to get the needed data from the menu model. As the hierarchy is created at runtime, and each node is stamped, the data for the current node is copied into the var attribute, which can then be addressed using an EL expression. You specify the name to use for this property in the EL expression using the var property. 5. Add one commandNavigationItem component as a child by dragging and dropping a Navigation Item from the Component Palette to the nodeStamp facet of the breadCrumbs component.

6. Set the values for the remaining attributes that have corresponding values in the

metadata using EL expressions that refer to the menu model whose metadata contains that information. You access these values using the value of the var attribute you set for the parent breadCrumbs component in Step 4 along with the name of the corresponding itemNode element that holds the value in the metadata. Table 18–5 shows the attributes on the navigation item that has corresponding values in the metadata. For example, if you had set the var attribute on the breadCrumbs component to menuNode, you would use {menuNode.doAction} as the EL expression for the value of the action attribute. This would resolve to the action property set in the metadata for each node. Example 18–14 breadCrumbs Component Bound to a MenuModel af:breadCrumbs var=menuNode value={root_menu} f:facet name=nodeStamp af:commandNavigationItem text={menuNode.label} action={menuNode.doAction} f:facet af:breadCrumbs Note: The value attribute should reference only a root menu model and not any menu models referenced through shared nodes. For example, if you use a shared node in your main XMLMenuModel element as shown in Example 18–8 , JDeveloper would have created managed bean configurations for the shared node and the root XMLMenuModel bean that consumes the shared model. The shared model managed bean is automatically incorporated into the root menu model managed bean as the menu tree is parsed at startup. Tip: You can use the same value for the var attribute for the breadCrumbs component as you did for the navigationPane components on the page or in the application. Note: The nodeStamp facet of the breadCrumbs component determines what links appear according to the menu model that you specify for the value attribute of the breadCrumbs component. If you do not specify the menu model you want to render for the value attribute of the breadCrumbs component, no links appear at runtime. Do not use a nodeStamp facet for the breadCrumbs component if you do not use a menu model because no stamps will be required. Working with Navigation Components 18-29

18.6.5 What Happens at Runtime

The value attribute of navigationPane component references the managed bean for the XMLMenuModel element. When that managed bean is requested, the following takes place: ■ The setSource method of the XMLMenuModel class is called with the location of the model’s metadata, as specified in the managed-property element in the faces-config.xml file. ■ An InputStream object to the metadata is made available to the parser SAXParser; the metadata for the navigation items is parsed, and a call to MenuContentHandler method is made. ■ The MenuContentHandler builds the navigation menu tree structure as a List object in the following manner: – The startElement method is called at the start of processing a node in the metadata. – The endElement method is called at the end of processing the node. – As each node is processed, a List of navigation menu nodes that make up the page hierarchy of the menu model is created. ■ A TreeModel object is created from the list of navigation menu nodes. ■ The XMLMenuModel object is created from the TreeModel object. If a groupNode element has more than one child id in its idref attribute, the following occurs: ■ The IDs are processed in the order they are listed. If no child node is found with the current ID, the next ID is used, and so on. ■ Once a child node is found that matches the current ID in the idref list, then that node is checked to see if its rendered attribute is set to true, its disabled attribute is set to false, its readOnly attribute is set to false, and its visible attribute is set to true. If any of the criteria is not met, the next ID in the idref list is used, and so on. ■ The first child node that matches the criteria is used to obtain the action outcome or destination URI. If no child nodes are found that match the criteria, an error is logged. However, no error will be shown in the UI. ■ If the first child node that matches the criteria is another groupNode element, the processing continues into its children. The processing stops when an itemNode element that has either an action or destination attribute is encountered. ■ When the itemNode element has an action attribute, the user selection initiates a POST action and the navigation is performed through the action outcome. When the itemNode element has a destination attribute, the user selection initiates a GET action and navigation is performed directly using the destination value. The XMLMenuModel class provides the model that correctly highlights and enables the items on the navigation menus such as tabs and bars as you navigate through the navigation menu system. The model is also instantiated with values for label, doAction, and other properties that are used to dynamically generate the navigation items. The XMLMenuModel class does no rendering; the navigationPane component uses the return value from the call to the getFocusRowKey method to render the navigation menu items for a level on a page. 18-30 Web User Interface Developers Guide for Oracle Application Development Framework The commandNavigationItem component housed within the nodeStamp facet of the navigationPane component provides the label text and action outcome for each navigation item. Each time the nodeStamp facet is stamped, the data for the current navigation item is copied into an EL-reachable property, the name of which is defined by the var attribute on the navigationPane component that houses the nodeStamp facet. The nodeStamp displays the data for each item by getting further properties from the EL-reachable property. Once the navigation menu has completed rendering, this property is removed or reverted back to its previous value. When users select a navigation item, the default JSF actionListener mechanism uses the action outcome string or destination URI to handle the page navigation. The XMLMenuModel class, in conjunction with nodeStamp facet also controls whether or not a navigation item is rendered as selected. As described earlier, the XMLMenuModel object is created from a tree model, which contains viewId attribute information for each node. The XMLMenuModel class has a method getFocusRowKey that determines which page has focus, and automatically renders a node as selected if the node is on the focus path. The getFocusRowKey method in its most simplistic fashion does the following: ■ Gets the current viewId attribute. ■ Compares the viewId attribute value with the IDs in internal maps used to resolve duplicate viewId values and in the viewIdFocusPathMap object that was built by traversing the tree when the menu model was created. ■ Returns the focus path to the node with the current viewId attribute or returns null if the current viewId attribute value cannot be found. The viewId attribute of a node is used to determine the focus rowKey object. Each item in the model is stamped based on the current rowKey object. As the user navigates and the current viewId attribute changes, the focus path of the model also changes and a new set of navigation items is accessed.

18.6.6 What You May Need to Know About Using Custom Attributes

Custom attributes that you have created can be displayed, but only for itemNode elements. To add an itemNode element to access the value of a custom attribute, you need to get the tree from the menu model by: ■ Calling the menu models getWrappedData method ■ Calling the getFocusRowKey method to get the current focus path ■ Using this focus path to traverse the tree and return a list of nodes in the focus path ■ Testing one or more of these nodes for custom attributes by calling the getCustomProperty API Example 18–15 shows an example of the required code. Example 18–15 Accessing Custom Attributes from the XMLMenuModel Returns the nodes corresponding to a focus path param tree param focusPath public List getNodesFromFocusPathTreeModel tree, ArrayList focusPath {