Harness form — Adding a container |
A container can provide a visual grouping of other elements on a harness form, including sections and subsections. Every harness contains one or more containers. A container may contain a header, and includes the area of the harness form where tabs appear, if you use tabs to present sections.
Click the down-arrow () at the right end of the Layout control group () and select the Container control (). Drag the control. When the pointer changes shape to indicate that you can drop the control, release the mouse button.
Alternatively, you can select an existing container and click the Insert Row Above () or Insert Row Below () button to add a new one above or below the selected one.
Click the icon to display the Container panel.
To delete a container, select the layout and click the Delete Row button (), not the Delete Cell button.
When you have finished completing the Container panel properties as described in this topic, add a section to the container. See Harness and Section forms — Adding a Section.
Complete the Container tab to control visibility of the container and header.
Your updates to this panel update the rule form upon clicking Apply. If the panel is pinned(), the wireframe on the rule form changes immediately to reflect your inputs. If the panel is not pinned (), click Apply to apply your inputs.
Field |
Description |
||||||||||
Format | Choose a format to control what appears above the layout (known as a header), and the appearance of both the header, and aspects of the body. This choice primarily affects styles and appearance.
Using the Skin rule, you can review or revise the styles (colors, fonts, padding and margins) associated with each header format.
|
||||||||||
HTML |
Identify the Stream Name key part of an HTML rule that defines the contents and appearance of a custom header. The system uses the Applies To key part of this harness as the first key part of the HTML rule. This field appears when you select |
||||||||||
Title |
Optional. Enter literal text, a reference directive, reference JSP tag, Lookup directive, or JSP tag to derive the text to appear in the left title area of a header. For example, enter {.pyLabel} or equivalently <pega:reference name=".pyLabel" /> to use the value of a property named pyLabel as a title. This field is visible when you select Note: If your application is to support users in multiple locales, choose a noun or noun phrase for the caption. When practical, choose a caption already included in a language pack, to simplify later localization. Select the Localize? box on the HTML tab. Limit title text to no more than 64 characters, even after JSP or directive tags are expanded. See About the Localization wizard. |
||||||||||
Visible When | Optional. Leave blank so that the section is always visible. To control the visibility of the section, enter or select one of the following:
As a best practice, use the Condition Builder to edit this field. Click ( ) to open the tool. See Using the Condition Builder to configure dynamic UI actions. Note: Do not confuse Expanded When with Visible When. When collapsed but visible, the clickable header appears. When not visible, nothing appears. |
||||||||||
Run on Client? |
Appears when you enter a simple expression in the Visible When field. Select to cause evaluation and execution of the condition each time the value of a property stated in the condition changes. If unselected, the expression is evaluated and the condition executed when the form is initially presented and whenever the form is refreshed. By default, controls that allow typing, such as Text Input, are evaluated when the user leaves the field. To re-evaluate conditions as the user types, use the Apply Conditions action with a Keyboard event. See Control Form — Completing the Control tab. |
Complete the General tab. Fields on this tab change depending on your choices for Format and Header Type. This tab has no fields on this tab if you select No Header
or No Format
in the Format field.
Field |
Description |
Using Page |
Optional. Identify the name of a clipboard page on which the properties referenced in this area are located. By convention, the page containing the work item is named If you leave this field blank, the Pega 7 Platform assumes that properties referenced in this area are found on the primary page of the activity that displays the harness form. If, at runtime, no page with this name is found, all HTML output from this row is suppressed — both the top-level header and the included sections. If you name a page in an Applies To class that is not the harness's class inheritance path, define the class on the Pages & Classes tab before you save the rule. Note: This field does not appear if the Header Type is |
Header Type | Choose the format to be used to present this header:
|
Edit Options | Select an edit mode for this container.
You can override this container setting by modifying the Edit Options for a control on the cell Properties panel. |
Read Only Condition | This field appears only when you select Read Only in the Edit Options field.
To control the container's read-only behavior, enter or select one of the following:
As a best practice, use the Condition Builder to edit this field. Click ( ) to open the tool. See Using the Condition Builder to configure dynamic UI actions. |
Image | Optional. You can identify a small image to appear at runtime to the left of the title text. Enter the relative path to a binary file image, in the format path/name.ext.
Click to open the Image Catalog (a pop-up version of the Image Library landing page). Select the binary file you wish to use. |
Defer Load? | If you choose Collapsible , Accordion , and Tabbed as the Header Type, Select this box to transmit the details for this header to the browser on the user workstation only when a user clicks a plus sign or tab to view the expanded details of this header. Fields that do not interest most users are not transmitted unless the browser client sends an explicit request later.
Clear this box to force details for this header to be transmitted to users' workstations upon initial display, even when the body is not open. For the |
New Tab Group? | For Header Type of Tabbed only. Select to remove this tab from the tab group, and add it as a new tab group directly below the original group. Deselecting this property causes the separated tabs to merge back into the original tab group. Deselecting this option causes the separated tabs to merge back into the original tab group.
If this is the only tab in a group, his option is selected by default and cannot be changed. |
New Layout? | For Header Type of Accordion only. Select to remove this layout from the layout group, and add it as a new group directly below the original group. Deselecting this property causes the separated group to merge back into the original group. Deselecting this option causes the separated group to merge back into the original group.
If this is the only accordion in a group, this option is selected by default and cannot be changed. |
Complete the Advanced tab. Some fields on this tab change depending on choices you make in the top fields and General tab.
Field |
Description |
With Style | Optional. Identify the name of a CSS style for the container. Click() to review the text file rule that contains the style. |
Retrieve Activity |
Optional. If Defer Load? is selected, you can specify an activity to be run when the container is made visible when the user opens the body within the header (for instance, clicks the expand icon on a collapsible header). This activity can compute property values and other aspects of the opened container. |
Expanded When | Optional. Only applies to Collapsible and Tabbed header styles. Identify a when condition rule or a Java expression to control whether the container is initially presented as expanded or collapsed.
Leave blank so that the state of the layout (expand icon or collapse icon) when you save the Harness, Section, or Flow Action form becomes the state upon initial runtime presentation. Select one of the following:
.Width >= "20" && .Length >= "40" As a best practice, use the Condition Builder to edit this field. Click to open the tool. See Using the Condition Builder to configure dynamic UI actions. Note: Do not confuse Expanded When with Visible When. When collapsed but visible, the clickable header appears. When not visible, nothing appears. |