This content has been archived and is no longer being maintained.

Table of Contents

Article

How to refresh another area when a grid row changes

Summary

Using PRPC V6.2 SP2, you can refresh another area whenever the value of a property in a row of a grid changes. You can do this using Refresh When conditions that support the full property reference syntax and enable you to mix-and-match different types of comparisons in the condition expression. You can reference the value of embedded properties anywhere within the current work object (pyWorkPage clipboard page) or assignment.

To interact with a sample, select Pega Button> User InterfaceUser Interface> UI GalleryUI Gallery, and select Refresh On Change in the Combinations group.

This sample demonstrates using a Refresh When condition to refresh another area when a property in a row of the grid changes. For example, when a user changes an employee's status in the All Employees grid, the appropriate list below, Full Time, Part Time, or Contract, refreshes and displays the employee's name.

Refresh On Change sample

This article shows you how the Refresh On Change sample in the UI Gallery is configured using the following features:

Building Dynamic UI: Actions and Events

  • Run Data Transform
  • Refresh Section

Formatting the Grid

  • Fixed Height
  • Freeze Row Pane

Viewing Data in the Grid

  • Progressive Paging
  • Sorting

 

Suggested Approach

Configuration

This sample is comprised of multiple grids. Changing a property in the top grid, All Employees, causes the All Employees grid to refresh, along with the grids on the bottom, Full Time, Part Time, and Contract. Prior to the refresh, a pre-processing data transform runs, which removes the pages from the Full Time, Part Time, and Contract page lists, and then refreshes them, appending the selected employee name to the applicable list.

Configuring the All Employees Grid

This is a repeating grid sourced from a Page List:

All Employees Grid

To view the configuration:

  1. In the Refresh On Change sample, click the open link.
    Click open

  2. The pxRefreshOnChange section rule opens. On the Layout tab, click Wireframes icon to display the wireframe.

  3. In Layout 2, click the magnifying glass magnifying glass beside All Employees to open the Cell Properties panel.
    magnifying glass

  4. In the Cell Properties panel, click Click open to open the pxRefreshOnChangeAll section.


  5. On the Layout tab, click Wireframes icon to display the wireframe and then click the magnifying glass magnifying glass beside the Repeat Grid to view the configuration.


    This grid is sourced from a Page List and contains the employee name, .pyName, and the employee status, .pyEmployeeType.
    Repeat Grid

The Employee Type grids are configured to refresh whenever the employee status, .pyEmployeeType, in the All Employee grid changes.

Configuring the Employee Type Grids

Each list of employees, Full Time, Part Time, and Contract, is a repeating grid, the source of which is a Page List property. All three grids are contained within a single section that is refreshed whenever .pyEmployeeType, in the All Employee grid, changes.

Employees By Type Grids

To view the configuration of these grids:

  1. On the pxRefreshOnChange section rule Layout tab, click Wireframes icon to display the wireframe.

  2. In Layout 3, click the magnifying glass magnifying glassin the Section Include.
    magnifying glass

  3. In the Section Include, click Click open to open the pxRefreshOnChangeGrouped section.
    Click open

  4. This section is comprised of a Layout containing cells for Full Time, Part Time, and Contract. Each of these cells references an included section. For example, click the magnifying glass magnifying glass beside Full Time to open the Cell Properties. This cell uses the pxRefreshOnChangeFull section.
    Repeat Grid

  5. Click Click open to open the pxRefreshOnChangeFull section. Notice that is a repeating grid with progressive paging.
    Repeat Grid

  6. Click the magnifying glass magnifying glassin the Repeat Grid.
    magnifying glass

  7. The Source for this grid is a page list property, MetaData.pyFullTimeEmployees.
    Repeat Grid

The Full Time, Part Time, and Contract grids are all configured in the same way and sourced by the following Page List properties: MetaData.pyFullTimeEmployees, MetaData.pyPartTimeEmployees, and MetaData.pyContractEmployees,respectively.

Refreshing the Employee Type Grids When the All Employees Grid Changes

The Full Time, Part Time, and Contract grids are contained within the pxRefreshOnChangeGrouped section. This section, containing all three grids, is refreshed whenever the .pyEmployeeType changes. Prior to the refresh, a pre-processing data transform runs, which removes the pages from the Full Time, Part Time, and Contract page lists, and then refreshes them, appending the selected employee name to the applicable list. A function runs which sorts the list and displays the employee names in alphabetical order.

To view this configuration:

  1. On the Layout tab of the pxRefreshOnChange section rule, click Wireframes icon to display the wireframe.

  2. In Layout 3, click the magnifying glass magnifying glassin the Section Include.
    Repeat Grid

  3. Notice the Refresh When condition. Click the magnifying glass magnifying glass to open the Condition Builder and view the configuration.
    Section Include

  4. In the Condition Builder, note that the section is refreshed when MetaData.pyAllEmployees.pyEmployeeType changes. A data transform is configured to run prior to refreshing the section. Click Click open to open the data transform.
    Condition Builder

  5. Prior to refreshing the section, this data transform removes the pages from the Full Time, Part Time, and Contract Page Lists, and then refreshes them, appending the selected employee name to the applicable list. A function runs which sorts the list and displays the employee names in alphabetical order.
    Data Transform

Note: You can also use the AddDelete keyword to refresh a section when an item is added or removed from a list. For more information, see the PRPC online Help.

Published March 7, 2012 — Updated December 28, 2015

Have a question? Get answers now.

Visit the Pega Support Community to ask questions, engage in discussions, and help others.