Close popover
Richard Marsot (RichardMarsot)
Director, Front-end Development
Pegasystems Inc.
RichardMarsot Member since 2011 20 posts
Posted: September 6, 2019
Last activity: September 6, 2019

How to display case details in a separate pop up window

Some applications have a lot of details on a case (like history, details...) that usually cannot fit on a single screen without having the user scrolling back and forth to be able to access to the different pieces of information. This article explains how you can show these details into a new browser window.

For this article, we will show how to expose the case detail section into a new browser window. This assumes that the application is based on ui-kit and is using the pyCaseWorker portal. A new button will be added in the case details utility to expose this action.

1/ Add the 'open case details' button

Do a saveas of the section 'pyCaseDetailsWrapper' into your application. Add the button with the action 'openurlinwindow' which will pass the same using page and will call a new activity that we will called 'opencasedetails'. Use a simple format for this button.

2/ Create the new activity 'opencasedetails' at Work-

create this activity at 'Work-' inside your application rule - the activity will use the 'Show-Stream' api and will point to a new harness that will be created for this use case. We will call this harness 'CaseDetails'

3/ Create the new harness 'CaseDetails'

Create the new harness using a 'content only' screenlayout with a new section called 'CaseDetails'

in the case details section, add the information that you need. It is recommended to first use a default container format and use a h1 header title and then include any sections that are needed. For this article, we will add the 'pyCaseDetails', 'pyCaseInformation' and 'pyCaseRelatedContent' sections to display attachment, details and info about the case.

Here is the functionality in action. After creating a case, the case details are available in the new browser window (note that for this demo, Firefox is used). Attachments can be posted to the case in the main window and can be seen in the popup when refreshing the screen.

User Experience Developer Knowledge Share