LinkedIn
Copied!

Table of Contents

Modal dialog box

Version:

Only available versions of this content are shown in the dropdown
Applicable to Theme Cosmos applications

Modal dialog boxes help users focus on a specific task. Because users cannot continue in the application without processing or dismissing the modal dialog box, the modal dialog box also might provide you with tools to highlight required fields and actions.

Launching modal dialog boxes

Pega Platform provides the following methods for creating modal dialog boxes:

Flow action
You can configure a flow action in a Launch: local action set. The flow action provides the section or sections with the form fields that the user needs to complete. When users submit the form, the system updates the work item and the modal dialog box closes. The users can then continue working from the main screen. For more information, see Configuring a modal dialog box for a button.

To ensure that the server processes the modal dialog box accurately, use autogenerated controls.

If the modal dialog box updates a work object before a user submits the pop-up window, the system does not undo the changes to the work object when a user cancels the modal dialog box.

Table action
Hierarchical table, Navigational tree, and Table layouts support modal dialog boxes as table-specific actions. For editing rows, modal dialog boxes can use the flow-in model. For more information, see Configuring a modal dialog box for a list-based layout.

Templates

You can use the following modal dialog box templates to model the process flow when you design your application:

pzModalFlowTemplate
Starts a flow in a modal dialog box.
pzModalTemplate
Creates a typical modal dialog box to start a local action.
pzGridModalTemplate
Creates a modal dialog box that has a repeating layout to display records in a hierarchical list, hierarchical table, or a table format.
pzGridExpandPaneTemplate
Creates a modal dialog box that has an option to overwrite data or display detailed information about a row item in the table in an expanded pane. The flow action for the expanded pane is in the same section as the pane.
pzGridEmbedPaneTemplate
Creates a modal dialog box with an embedded pane. The flow action for the selected row in the list is embedded in another section or appears after the table. You can use embedded panes to edit, update, or preview information that is excluded from the primary view, such as information that is not directly related to the task, or that is too detailed for the system to display.

You can customize each out-of-the-box template and save it as a section for future reuse.

A sample modal dialog box
A modal dialog box that contains a Rich Text Editor.
  • Configuring a modal dialog box for a button

    Divide your user interface into smaller, context-sensitive chunks that appear only when relevant. By pairing a modal dialog box to a button, you can hide optional forms until the users request them. For example, you can add a Review button that users can click to correct their address information when they finalize an online order.

  • Configuring a modal dialog box for a list-based layout

    Give your users the tools to edit entries of a list-based layout in a modal dialog box. This approach helps your users perform their tasks without leaving the main screen, which reduces context switching.

Did you find this content helpful?

Have a question? Get answers now.

Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.