Section forms
Completing the Layout tab — Adding an Accordion control

Field

Description

Select Header - Standard for a bolder header or Standard (Sub) for a less bold header. An accordion must have a header: do not select Hidden or No Format.

Optional. Enter text to be presented above the table in the header or subheader. This text may include directives or JSP tags, such as <p:r > or <pega:lookup >.

When you plan to localize the application using this rule, so the application can support users in various languages or locales, choose the text carefully and limit the length to no more than 64 characters. When practical, choose a caption already included in a language pack, to simplify later localization. A field value rule with this text as the final key part is needed for each locale. See About the Localization wizard.

Choose Single, Double or Triple to control the number of column pairs in the Smart Layout.

Optional. To control visibility of this header, enter or select one of the following:

• Leave blank to always present the header.
• A when condition rule. Click the pencil icon () to review or create the when condition rule.
• Expression evaluated once — Enter an expression that returns true or false. This expression can involve multiple properties, function calls, and other syntax as supported by the <pega:when > JSP tag.

If this section is to become part of navigation in a composite portal, you can make the control visible only when a specific space is the current space. Select the Run on Client? check bas and enter an expression here similar to the following::

pyCurrentSpace=="ASpaceName"

Field

Description

To maintain an accordion layout, leave Accordion selected.

Optional. Provides the ability to reference a family of custom styles for accordion bars. For example, type A in this field to use styles named .A_headeraccordion* rather than the normal .headeraccordion* styles. Define the prefixed styles in your workform_zzzzz.css text file (created by the Application Skin wizard) or in another text file referenced on the Scripts and Styles tab of the Harness form.

Optional. Choose this option to delay loading at runtime of the section content until the user clicks the header.

Optional. Choose this option to convert the selected accordion bar, and those below it, to a new layout.

Field

Description

Optional. To control visibility of the body, enter or select one of the following:

• Leave blank to present the body always.
• A when condition rule. Click the pencil icon () to review or create the when condition rule.
• Expression evaluated once — Enter an expression that returns true or false. This expression can involve multiple properties, function calls, and other syntax as supported by the <pega:when > JSP tag.
• Simple Java expression evaluated upon JavaScript events — To dynamically control the visibility of the body with a JavaScript event, enter a simple comparison involving a target property and select the Run on Client? box. The result at runtime determines whether the content of this cell appears in read-only styles or in the styles of the enclosing layout.
  For example, enter .Color =="Red" in this field to make the body visible when the property Color has the value Red, and read-write styles otherwise. Depending on the state of the Run on Client? check box, the comparison can be executed only once as the form is initially displayed, or dynamically. See Implementing dynamic form actions and the Client Event Editor.

This check box appears only if the Body Visible When field contains a simple Java comparison.

Select to cause dynamic execution of the condition each time the value of the property mentioned in the condition changes. (Mark the field containing that property as a Client Event.) Leave cleared to cause the condition to execute only once, upon initial presentation of the form.

Optional. Select whether the width of columns in the table are to be set as a percent or in absolute pixels. Choose:

• px — To have the column widths on the work object form or flow action form match, in pixels, the column widths on the current rule form. (Internet Explorer may adjust column widths to avoid truncating values in the column.)
• px-fixed — To specify a column width exactly. Internet Explorer uses this width even when data values may be longer (after applying styles, margins, padding, and so on). The display may truncate a data value if the value is wider than width defined by the pixel value.
• % — To have the column widths on the work object form or flow action form adjust to fractions of the total width of the work object form or flow action form. For example, if you adjust the column on the rule form to be 25 percent of the total width, the column on the work object form or flow action form will be 25 percent of the form width, and will grow or shrink if a user resizes the form.

If you choose px-fixed and a property value at runtime is wider than width defined by the pixel value, the value is truncated, and users are unable to see the full value.

Optional. Type a value for the ID= attribute of the table element. The ID is useful when a JavaScript function needs to reference the entire table.

Optional. Click the magnifying glass icon() to open the Image catalog. Search for an image to include on the left side of the header.