Creating a BrowseMenu

This topic describes the steps for creating the layout of a browseMenu; hierarchical data is not used in this procedure. See the ADF UIX Developer's Guide for information about using data trees in ADF UIX.

To create a browseMenu:

In the Design Structure Window of the desired file, locate the pageLayout node.
If the pageLayout node is not visible, expand page | content | dataScope | document | body | form.
In the Component Palette, select Navigation Components from the dropdown list, and then drag and drop the browseMenu component from the list to the pageLayout node.
The browseMenu node is inserted and highlighted under the pageLayout node.
In the Property Inspector, set the following attributes for the browse menu:
- title - Enter the title for the browse menu. The default is "Browse".
- categoryTitle - Enter the title for the category section. The default is "Categories".
- itemTitle - Enter the title for the items section. The default is "Items".
- longDesc - Enter the text description to be displayed just under the browse menu title. This should describe the current location of the page.
- formName - Enter the name of the form to which browseMenu events are submitted.
- formSubmitted - If using form submission, click in the right column and select true.
- unvalidated - Set to "false" to disable validation of all form inputs, if form submission is used.
- defaultContents - Set to true if using BrowseMenuUtils.configureBrowseMenu.
- source - Enter the namespace and name to pass to BrowseMenuUtils.configureBrowseMenuName.
In the Design Structure Window, expand pageLayout | browseMenu | browseMenu Named Children, right-click contentLink and then choose Insert inside contentLink | link.
The link node is inserted and highlighted under the expanded contentLink node.
In the Property Inspector, set the following attributes for the content link you have inserted.
- text - Enter the text description for the link that will display below the browse menu title.
- destination - Enter a URL. The content link allows users to view additional information about the current content.
In the Design Structure Window, expand pageLayout | browseMenu | browseMenu Named Children, right-click categories and then choose Insert inside categories | bulletedList.
The bulletedList node is inserted under the expanded categories node.
Right-click the bulletedList node and choose Insert inside bulletedList | link.
The link node is inserted and highlighted under the expanded bulletedList node in categories.
In the Property Inspector, set the text attribute for the link you have inserted, and any other attributes you desire.
Repeat steps 7 and 8 to add any number of links for categories.
In the Design Structure Window, expand pageLayout | browseMenu | browseMenu Named Children, right-click items and then choose Insert inside items | bulletedList.
The bulletedList node is inserted under the expanded items node.
Right-click the bulletedList node and choose Insert inside bulletedList | link.
The link node is inserted and highlighted under the expanded bulletedList node in items.
In the Property Inspector, set the text attribute for the link you have inserted, and any other attributes you desire.
Repeat steps 11 and 12 to add any number of links for items.
In the Design Structure Window, expand pageLayout | browseMenu | browseMenu Named Children, right-click location and then choose Insert inside location | breadCrumbs.
The breadCrumbs node is inserted under the expanded location node.
Right-click the breadCrumbs node and choose Insert inside breadCrumbs | link.
The link node is inserted and highlighted under the expanded breadCrumbs node.
In the Property Inspector, set the text attribute for the link you have inserted, and any other attributes you desire.
Repeat steps 15 and 16 to add the required number of links for breadCrumbs.

Tip: If location and contentLink are used but empty, set the rendered attribute to false so that the spacing is displayed correctly.

Notes:

You must set an event handler for the browseMenu to function properly when a user selects a category or an item.
To use data binding, see Data Binding a Component Attribute.

Example (UIX XML)


...
<pageLayout>
  <contents>
    <!-- BrowseMenu Prototype -->
    <browseMenu categoryTitle="Categories"
                itemTitle="Items"
                title="Browse">
      <categories>
        <bulletedList>
          <contents>
            <link text=""/>
          </contents>
        </bulletedList> 
      </categories>
      <contentLink/>
      <items>
        <bulletedList>
          <contents>
            <link text=""/>
          </contents>
        </bulletedList> 
      </items> 
      <location> 
        <breadcrumbs>
          <contents>
            <link text="link"/>
          </contents>
        </breadcrumbs>
      </location> 
    </browseMenu> 
  </contents> 
  
  <!-- REST OF PAGE LAYOUT-->
  
</pageLayout>
...