Flow Action form
Completing the Layout tab

C-1778Use the controls at the top of this tab and drag and drop operations to review or update this flow action rule and associated section rules.

You cannot use this tab to modify flow action rules with the Reference HTML checkbox checked (on the  HTML  tab). These are marked Not Auto-Generated on this tab. HG - Auto-generated HTML? option no longer existsGRP-288 TASK-18332

When you save this rule form, Process Commander also saves any section rules that the harness rule references (excluding read-only section rules), and validates all saved rules.

As a best practice, build your application skin (using the Branding wizard) before you develop flow action rules, especially if you are using SmartLayouts (with spacing determined by the skin styles.) The system renders the Layout tab using the styles of the skin rule identified in the Skins field of the Run Process In group of your General preferences. If the Skins field is blank, these displays use the styles marked Work on the Styles tab of the skin identified in your current portal rule. See Designer Studio — Setting your preferences. 5.5 GRP-503

Using the Flow Action form to review or update a flow action rule causes a clipboard page to be created and properties to be initialized, which may in turn cause declarative processing to be executed. Use caution before implementing any on-change declarative processing that produces database updates. F-174 APAP SR-866 GROVS 10/11/05

Controls that alter the preview

The preview area of this tab holds an approximate visual presentation of the runtime appearance of the flow action:

• Click the button to present the SmartFrames wireframe preview. Blue wireframe rectangles help you understand the structure of the section, names of rules referenced in this rule, and the size and other relationships of elements in the section.

• Click the button to hide wireframes, providing a less busy and higher fidelity preview. These buttons do not affect the contents of the rule, only the display on this tab.

Controls that alter a layout table

These controls operate on a table structure. Select one or more cells first, then click the control to apply the operation described. When a control is not available (grayed), it cannot be applied to the current selection.

Control	Description
	Insert a new row before (above) the selected row.
	Insert a new row after (below) the selected row.
	Delete the selected row.
	Insert a new column before (to the left of) the selected column.
	Insert a new column after (to the right of) the selected column.
	Delete the selected column.
	Merge the selected cells (in a single row) to one cell.
	Merge down, combine thing selected cell and the cell below it. Proj-649 5.4
	Unmerge — Undo the immediately previous merge.
	Delete the contents of a single cell (not a row or column).

You can also alter the table structure by selecting a row, cell, or column and right-clicking to access a context menu. Select a menu operation: Cut, Copy, Paste, Insert Row, Delete Row, or Delete Column.

Structurally, a flow action rule consists of one or more sections.

In turn, each section consists of layouts with rows and columns that define cells. Each cell may be empty, or may contain a label, field, button, URL, or icon, or in unusual cases a section.

In most cases, all the fields (property references) within the flow action rule are from the Applies To page of the rule, typically the page that holds the work object.

6.1 updated PASHM 10/21/10 All V6.1+ flow actions reference one or more sections. When you create a new flow action, the hintappears in the Layout tab. You can drag an existing section from the Application Explorer or create a new section.

Within a referenced section, you can convert a layout to a section rule. Click the Save As Section icon () next to the magnifying glass in the wireframe's layout header, which displays a New section dialog. Enter a Purpose key value and save the section to your work class.

The formats in pre-V6.1 flow actions were configured with layouts rather than sections. You cannot edit these layouts until you upgrade the flow actions. See More about Flow Action rules.

You can rapidly mock up the layout, labels, and controls on this tab before all properties it ultimately will reference are defined. The development effort you make in designing the layout is not wasted, as the resulting section rule is a valid starting point for further evolution after the property rules are created.

When you first drop a control dragged from the Basic Group, the control references a standard placeholder property, for example @baseclass.pyTemplateInputBox. You can save and preview the Section form (although these properties are not part of your application).

To produce a flow action rule with the appropriate layout, drag and drop the controls and adjust the labels, but do not complete the Cell Properties panels. Reopen the Flow Action form and update each Cell Properties panel later, when the real properties are defined.

See the Pega Developer Network articles:

• PRKB-25216 Use pyTemplate properties and controls to rapidly prototype work object forms
• PRKB-25900 How to model the user interface of your application before all properties are defined

Each control is defined by your inputs in floating panel, which you can pin for faster input. To open the panel, select the control you have placed in the section and click the magnifying glass () icon that appears. Use these controls on the header of floating panel:

• — Pin the panel to a location. The OK button disappears, and each input you enter is immediately applied to the open rule form.
• — Release the pin. The OK button appears. Your inputs do not affect the open form until you click OK.
• — Collapse (hide) the panel body.
• — Expand a collapsed panel body.
• — Close the panel. If you have entered changes that are not yet applied, a warning dialog may appear, depending on the Warn on modified checkbox in the SmartFrames Edit area of the Edit preferences group. See Designer Studio — Setting your preferences.

Click the down arrow () in the Container control group ( and select a control: PROJ-649 5.4

Control	Description
	Add a section rule into this flow action. See Adding a section.
	Add a layout to this flow action — a <TABLE> element containing one or more rows and one or more columns. You can then change the number and size of rows and columns, and set up the contents of each cell (a <TD> HTML element). See: Adding a layout Adding a Row Repeat layout Adding a Column Repeat layout Adding a Tabbed Repeat layout Adding a Grid layout Adding a Tree Grid layout Adding a Tree layout

The Container, Panel Set, and Accordion controls are not available for flow actions.

A cell can hold a label or property value or a form field that accepts a user-entered property value. The property value uses a control rule to present the value in read-only or read-write mode.

Click the down arrow () in the Basic control group () and select a control:

Control	Description
	Add a static read-only text label into a cell. Adding a label.
	Add a Text Input, which corresponds to .pxTextInput control rule. Adding a Text Input control.
	Add a TextArea, which can contain more than one line of text. Corresponds to the .pxTextArea control rule. Adding a Text Area control.
	Add an icon to the form, in a cell or on a header. When clicked at runtime, the icon starts an action. Corresponds to the .pxIcon control rule. Adding an icon.
	Place a button into a cell or to the bottom of the form. When clicked at runtime, the button starts the action you assign to it. Adding a button.
	Add a checkbox representing a TrueFalse value. Corresponds to a .pxCheckbox control rule. Adding a Checkbox.
	Add a radio button group representing a property value. Adding a radio button group.
	Place a text link in a cell. When clicked at runtime, the link starts an action. Corresponds to a .pxLink control rule. Adding a Link control.
	Add a text box containing a Date or DateTime value. Corresponds to the .pxDateTime control rule. Adding a Calendar control.
	Add a Select control that presents a fixed list of values. Adding a Select control.
	Include an image in the form. Adding an Image. GRP-1041

Click the down arrow () in the Advanced control group () and select a control: PROJ-649 5.4

Control	Description
	Include in a cell a paragraph rule that presents read-only text and images using rich text. Optionally, you can link a SmartInfo pop-up section with the paragraph. Adding a paragraph. C-2526
	Use an AutoComplete text box to present a drop-down list of dynamic choices computed by an activity. Adding an AutoComplete field.
	Add a red label that opens a pop-up SmartInfo section when the user hovers the mouse pointer over the label. Adding a Smart Label. PROJ-1019
	Add a Dynamic Select control. Adding a Dynamic Select control.
	Add a control that allows multiple selections from a possibly long list. Adding a list-to-list control.
	Present rows of a report, optionally allowing selection. Adding a List View display.
	A cell can contain an interactive chart, defined by a summary view rule with a completed Chart tab. Adding a chart.
	For flow actions that are part of a composite application built with Internet Application Composer only. Add a hidden field to expose a property value, making it available to the external page that displays the composite application. Adding a Data Field control.
	Add a menu bar. See Adding a menu bar. GRP-237 5.5
N/A	In addition to these Advanced controls, you can add an interactive data displays to support quick review or editing for a Page List or Value List. Adding a Tree, Adding a Grid, Adding a Tree Grid.

You can complete two cells of a layout in one step if the left cell is to contain a text label and the right cell is to contain a field corresponding to a property on the Application Explorer.

1. Locate and expand the work type that contains the property on the Application Explorer.
2. Expand the Data Model category () and the property rule type to list property names.
3. Select the blue dot () for the Single Value property to be placed in the field. Drag and drop the dot into the desired cell.
4. The system places the Short Description text of the property as a label in the left cell. It places the property as a (read-write) field in the right cell. You can adjust the settings for these cells.

Normally, property references on the form are to properties defined in the class corresponding to the Applies To key part of the flow action rule (or to an ancestor class of that class). In most cases, this class is derived from the Work- base class. GRP-288 TASK-18332HG - changes, mentioned that there wasn't a Pages & Classes tab, not true

You can include a section in a Flow Action form that indirectly references properties in other classes. WERDA HERTC KARAF 3/7/06 clinic For example, to present properties from a page in the Data-Party-Gov class:

1. Create a section with Data-Party-Gov as the Applies To class. Click the down arrow () in the Container control group () and add Layout control (). Insert labels and fields as desired, referencing the properties needed in the Data-Party-Gov class.
2. Create a second section using SmartFrames formatting. Set the Applies To class of the new section to the Applies To class of the flow action rule (or a parent class).
3. Drag the Section control () into the margin of the layout control. Drop the control on the Layout label itself — not a cell — to make the dropped section a peer of this section. The layout border becomes yellow.

4. Complete the pop-up dialog box that appears. Select On a different object, and identify the Applies To and Purpose key parts of the Data-Party-Gov section. Click  OK .

5. Finally, open the Flow Action form. Drag and drop the Section control
   () into a cell. Complete the Section Include panel, identifying the second section you created. It includes the Data-Party-Gov section.
6. Save the Flow Action form.

After you save this rule form, click the Preview toolbar button () to see a split-screen presentation of the runtime appearance of the flow action rule, in read-write mode.

• PRKB-25623 How to create attractive flow actions using SmartLayouts
• PRKB-25216 Use pyTemplate properties and controls to rapidly prototype work object forms
• PRKB-25900 How to model the user interface of your application before all properties are defined