Inserting a HideShow Component

To insert a hideShow component:

In the Design Structure Window of the desired file, locate the parent node in which you wish to insert a hideShow component, e.g., sideBar or styledList.
In the Component Palette, select Layout Components from the dropdown list, and then drag and drop the hideShow component to the parent node of your choice.
The hideShow node is inserted and highlighted under the expanded parent node in the Design Structure Window. The Property Inspector shows the attributes you can set for the hideShow component.
In the Property Inspector, set the following attributes for the hideShow component you inserted:
- disclosed - Enter true to show the indexed children. Enter false to hide the contents.
- disclosedText - Enter the text to replace the default "Hide".
- formSubmitted - Enter true to enable form submission. Default is false.
- selected - Enter true to render the hideShow component as selected.
- undisclosedText - Enter the text to replace the default "Show".
- destination - Enter the base destination for the hide/show link. This is ignored if form submission is enabled.
- formName - Enter the name of the form to which hideShow events should be submitted. Default is the parent form.
- unvalidated - If formSubmitted is true, all form inputs are validated before submitting to the server. To disable validation, enter false.
- partialRenderMode - Enter self or multiple to enable partial page rendering. If enabling partial page rendering, you must also set the id attribute.
- partialTargets - If partialRenderMode is multiple, enter the IDs of the partial target nodes to render. Do not enter the hideShow ID as it is automatically included in the partial targets list.
To insert an indexed child component into hideShow , drag and drop a component from the Component Palette to the hideShow node, and then use the Property Inspector to set the attributes for the child. Repeat to add additional indexed children as desired.
To use the prompt named child, do the following:
1. In the Design Structure Window, expand the hideShow node, then expand the hideShow Named Children node to uncover the prompt node.
2. Right-click the prompt node and choose Insert inside prompt | link.
3. In the Property Inspector, set the following attributes for the link component:
  - text - Enter the text to display next to the arrow icon.
  - destination - Enter the URI that the prompt link references.

Note: To use data binding, see Data Binding a Component Attribute.

Example (UIX XML)


...
<page ...>
   ...
   <pageLayout>
   ...
     <hideShow disclosed="true" id="hs1">
       <prompt>
         <link text="Text next to icon" destination="#"/>
       </prompt>
       <contents>
         Put indexed children here
       </contents>
     </hideShow>
   ...
   <!-- REST OF PAGE LAYOUT -->
   <pageLayout>
 ...
 <handlers>
   <event name="hide">
     ...
   </event>
   <event name="show">
     ...
   </event>
 </handlers>
</page>