|
Contents ![]() |
Using the accordion control, you can stack layouts vertically, each with a visible header. At runtime, when the user clicks one header, the layout body becomes visible and the other open body closes. For an example, see Pega Developer Network article PRKB-25414 How to display collapsed form sections using the Accordion control.Proj-1012 5.4SP2
When accordion controls are within a section
that is within a panel of a panel set, runtime behavior automatically
adjusts to consume the entire available height, and to supply scroll bars
when necessary. GRP-1142
1. Adding and
deleting an Accordion control
Click the down-arrow ( ) at the right
end of the Layout control group (
) and
select the accordion control (
). Alternatively, click the Layout control
group itself to pop-out the Layout control group window. Click and
drag the control on to the work area. When the pointer changes shape
to indicate that you can drop the layout, release the mouse
button.
To delete an accordion control, select the control and click the
Delete Row button (). Do not use the Delete Cell button for this
action.
2. Complete the
Layout Panel — Top fields
Click the magnifying glass icon () to open the Layout panel. Complete the top
fields, General tab, and Advanced tab. GRP-224
Your updates to this panel can update the rule form immediately or
upon clicking Apply, depending on the
Property Panel settings in your Edit
preferences. See Setting your preferences.
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 |
Header |
Select |
Title |
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 >.
|
Template |
Choose |
Visible When |
Optional. To control visibility of this header, enter or select one of the following:
pyCurrentSpace=="ASpaceName" |
3. Complete the
Layout Panel — General tab
Field |
Description |
Header Type |
To maintain an accordion layout, leave
|
Style Prefix |
|
Retrieve Activity | Optional. If Defer Load? is selected, you can specify an activity to be run when the container is expanded by a click. This activity can compute property values and other aspects of the expanded container. |
Defer Load? |
Optional. Choose this option to delay loading at runtime of the section content until the user clicks the header. |
NewLayout? |
Optional. Choose this option to convert the selected accordion bar, and those below it, to a new layout. |
4. Complete the
Layout Panel — Advanced tab
Field |
Description |
Body Visible When |
Optional. To control visibility of the body, enter or select one of the following:
|
Run on Client? |
This checkbox 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. |
Width |
|
ID |
Optional. Type a value for the |
Header Image |
Optional. Click the magnifying glass icon( |