Section, Harness, and Flow Action forms
Adding an Icon control

A cell in a layout or a harness can contain an Icon control, which invokes an action when the user clicks or hovers the mouse pointer over the icon. The Button and Link click-action controls share most of the same capabilities — their differences are mainly in their presentation.

As of V6.2, the Icon control uses the auto-generated control pxIcon. The icon and its behavior are governed by the settings in the rule form's Control tab. The Parameters tab is not available and the HTML cannot be edited. As a best practice, do not modify a copy of the rule while designing a section, flow action, or harness. Instead, use the Parameters dialog available in the control's Cell Properties panel. Instead, use the Parameters dialog available in the control's Cell Properties panel. See Control rule — Completing the Control tab.

Use the pxIcon control in new development. The V5 Icon control remains supported in V6.X. See About the V5 Icon control.

The UI Gallery landing page contains a working example of this control. To view and interact with this example and review its configuration, select > User Interface > UI Gallery and select Icon in the Controls group.

1. Drag and drop the Icon control

Click the down arrow () in the Basic control group () and select the Icon control (). Drag the control to the cell or header area that is to contain it. When the pointer changes shape to indicate that a single cell or header is selected, release the mouse button.

If the cell is not empty, the dropped icon replaces the current contents of the cell or header location.

An Icon control can be placed in harness header.

2. Complete the Cell Properties panel — Top fields

Click the magnifying glass icon () to open the Cell Properties panel. Complete the top fields that appear.

If the panel is pinned (), the wireframe presentation on the rule form changes immediately to reflect of your inputs. If the panel is not pinned (), click Apply to apply your inputs.

Field

Description

(Appears only when this field is in a section included within the current open rule.) Click to open the section that immediately contains the field.

Control

The default pxIcon control appears. A default icon appears (

) in the cell. Click the pencil icon ( Pencil

) to review the control identified in this field.

Customizing the control

The Icon's default parameters represent the basic configuration. However, you will need to specify the binary file used for the icon and the action or actions that will execute when the user clicks or hovers the mouse pointer over the icon. See Control Form — Completing the Control tab for descriptions of the available parameters and how to define behaviors.

For example, you can configure the control to refresh a section or display a new harness. In addition, you may want to:

Add a label or tooltip.
Add conditions that, for specific users, disable or hide the icon.

Your edits apply only to the icon within the context of the section that contains it and do not update the underlying rule.

Do the following to customize an auto-generated control in a section:

Open the section or harness that contains the rule.
Select the cell containing the rule and open its Cell Properties panel.
In the panel, select the magnifying glass icon () next to the Control field. This displays the control Parameters dialog. See Control Form — Completing the Control tab for descriptions of the available parameters and how to define behaviors.
Modify as necessary. You cannot edit the rule form's Control Modes and UI Element settings.
To immediately render your changes, click OK in the dialog. If satisfactory, save the section. The system generates the XML representing your edits and stores it in the section.

Standard icon controls

PRPC provides standard variations of pxIcon. Each is preconfigured with an icon, tooltip, and action. As a best practice, use these standard rules to ensure correct appearance and behavior. In the Cell Properties panel, use AutoComplete () in the Control field to select a rule.

If the action is not included in the list, keep pxIcon and use the Parameters dialog to configure the control.

This table below describes the icon name, the icon, the action invoked when clicked, and the standard icon control, which contains the control's parameters.

Icon Name	Icon and Action	Control Rule
`Add Item`	— Adds (above or below) a row to a grid, tree, or tree grid layout	pxIconAddItem
`Add New Work`	— Adds a new work item using the primary page data. Saves the new work item on the deferred list.	pxIconAddNewWork
`Attachments`	— Presents a list of work item attachments, so users can view or add attachments. This icon appears only for users who hold the Work-.AccessAuditTrail privilege.	pxIconAttachments
`Blank`	— No action is associated with it.	pxIcon
`Cancel`	— Closes the current form without applying any changes.	pxIconCancel
`Contents`	— For a cover work item, changes the form to allow users to view and navigate among the covered work items. You can override a standard list view rule to control details of this display.	pxIconContents
`Delete Item`	— Removes a row in a grid, tree, or tree grid layout.	pxIconDeleteItem
`Enable Action Section`	— Presents the user form in review-only mode; inputs allowed in the action section only.	pxEnableActionSection
`Expand/Collapse`	— Redraw the form with all areas fully expanded.	pxIconExpandCollapse
`Explore`	— For a folder work item, changes the form to allow users to view and navigate among the associated work items.	pxIconExplore
`Finish Assignment`	— Submits changes and marks this assignment as complete.	pxIconFinishAssigment
`Get Next Work`	— Cancels any unsubmitted changes and finds the most important assignment to work on next.	pxIconGetNextWork
`History`	— Displays the work item history, for users who hold the Work-.AccessAuditTrail privilege.	pxIconHistory
`Print`	— Starts browser-based printing, which prints the current user form as displayed. This printout may not include desired fields and may use colors, fonts, and labels that are not desired in hard copy prints.	pxIconPrint
`Reopen Work Item`	— Reopens a resolved work item, for users who hold the Work-.Reopen privilege. Runs the standard activity Work-.Reopen or your application override.	pxIconReopenWorkItem
`Review`	— Presents the user form in review-only mode, allowing no updates.	pxIconReview
`Save`	— Saves the work item with Submit.	pxIconSave
`Show Flow Location`	— Known as the Where-am-I? icon, presents the current flow rule as Visio diagram, and marks the location of the current assignment with an arrow. This icon appears only to users who hold the Perform privilege. If the harness is a New harness — one supporting the entry of new work items — do not include the `Show Flow Location` icon in most cases. A flow execution doesn't start until users submit a user form. If you do include this icon in a New harness, use a when condition rule to disable the icon at runtime unless a non-blank work item ID exists.	pxIconShowFlowLocation
`Show Reopen Screen`	— Shows the form in review mode but allows users to reopen a resolved work item. Available to users who hold the Work-.Reopen privilege. Runs the standard activity Work-.Reopen or your application override.	pxIconShowReopenScreen
`Spell Checker`	— Enables spell-checking. See How to enable spellchecking in user forms.	pxIconSpellChecker
`Update`	— Redraws the form in update mode. Appears only for users who hold the Work-.Update privilege. Update mode allows changes to values that appear in sections other than the TAKE ACTION section. This capability is not desirable in all applications, as it allows users to overwrite values entered previously, perhaps by other users. The Apply button sends changed user inputs to the server, but does not commit these changes. The user must select and complete a flow action to save the changes. See Understanding transactions in flow executions.	pxIconUpdate

3. Complete the Cell Properties panel — General tab

Complete the General tab.

Field	Description
Visible	Select to determine when the icon appears. (If this setting is not applicable, the cell contents are blank.) Choose `Always` to have the icon appear or be hidden based on the visibility of the enclosing section or flow action when the form is first presented or is refreshed. This condition is checked only once. Choose `Other Condition` to make the visibility depend on a when condition rule, a Boolean expression evaluated only once, or a test evaluated repeatedly upon JavaScript events.
Condition	If you selected `Other Condition` for the Visible field, complete this field. The When Name key part of a when condition rule. Click the pencil icon () to review or create the rule. Simple expression based on the comparison of a pair of constants, properties, or both, combined by Boolean operators, such as .Color="Red". You can combine the expression with a when condition rule or another expression using the && and \|\| operators. As a best practice, use the Condition Builder to edit this field. Click the magnifying glass icon ( ) to open the tool. See Using the Condition Builder to configure dynamic UI actions.
Run on Client?	Appears if the Condition field contains a simple comparison. 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.

4. Complete the Cell properties panel — Advanced tab

Complete the Advanced tab to control the presentation and visibility of the field.

Field	Description
Read-Write Style	Optional. By default, when the user form or flow action form appears in read-only mode, the CSS style named `DataValueRead` or `DataValueRead RV2` applies. If this cell is not controlled by Smart Layout restrictions, you can enter another style name or select from those listed. The SmartPrompt list shows all styles that start with the word `Data`. You are not limited to these styles. Click the pencil icon () to review the text file rule that defines the style sheet. Your application can override and extend this style sheet in an application text file rule.
Read-Only Style	Optional. By default, when the user form or flow action form appears in read-only mode, the CSS style named `DataValueRead` or `DataValueRead RV2` applies. If this cell is not controlled by Smart Layout restrictions, you can enter another style name or select from those listed. The SmartPrompt list shows all styles that start with the word `Data`. You are not limited to these styles. Click the pencil icon () to review the text file rule that defines the style sheet. Your application can override and extend this style sheet in an application text file rule.
Inline Style	Enter CSS code for an inline style for a cells in the column. For guided assistance in composing a style definition, click the magnifying glass icon () to open the Style Editor. You can select from predefined lists or type a style definition directly, and preview the results.
Show When Active	This checkbox appears when control is placed in the repeating area of a Grid, Tree Grid, or Tree layout. If checked, the icon displays in the row only when the user selects it.

Copying, deleting, duplicating, or moving an icon

Use these Windows operations to speed development:

To move a cell containing an icon, select the cell and drag and drop it in another cell in the same layout or another layout.
To cut, copy, or paste a link in a cell, right-click in the cell to access a context-menu.

About Flow Actions

About Harnesses

About Sections

Section, Harness, and Flow Action forms Adding an Icon control

Field

Description

Customizing the control

Standard icon controls

Icon Name

Icon and Action

Control Rule

Field

Description

Field

Description

Section, Harness, and Flow Action forms
Adding an Icon control