Skip to main content

Grouping fields in Views

3 Tasks

15 mins

 Visible to: All users
Beginner Pega Platform '23 User Experience English

Scenario

Based on feedback, GoGoRoad's customers are unable to double-check details before submitting an Assistance Request, leading to confusion and additional time spent correcting details. The GoGoRoad management team has decided to implement a final read-only confirmation screen after customers enter all the relevant information. This confirmation screen presents all the information to the customer before allowing them to submit their Assistance Request.

The following table provides the credentials you need to complete the challenge.

Role User name Password
Application Developer author@gogoroad pega123!
Note: Your practice environment may support the completion of multiple challenges. As a result, the configuration shown in the challenge walkthrough may not match your environment exactly.

You must initiate your own Pega instance to complete this Challenge.

Initialization may take up to 5 minutes so please be patient.

Challenge Walkthrough

Detailed Tasks

1 Add a Collect information Step to the Enter payment information Process

  1. In the Pega instance for the challenge, enter the following credentials:
    1. In the User name field, enter author@gogoroad.
    2. In the Password field, enter pega123!.
  2. In the navigation pane of App Studio, click Case Types > Assistance Request to open the Assistance Request Case Type.
  3. In the Enter payment information Process, click Step > Collect information to add a collect information Step.
    add-collect-information-step
  4. Rename the Step Review assistance request.
  5. In the properties pane, click Configure View to open the form editor.
  6. In the left pane, click Views to see the list of Views.
    configure view window
  7. From the list of Views, hover over Enter customer information and then click the Add icon to add the existing View to the Review assistance request Step.
  8. Repeat step 6 to add the Identify location, Identify vehicle, and Enter payment information Views.
    adding of fields to a section
  9. In the Options list, select Read-only for all the Views added.
  10. Click Submit.
  11. Click Save to save the changes to the Assistance Request Case Type.

2 Add layout groups

  1. Create a new Assistance Request Case.
  2. Advance the Case to the Enter customer information Step.
  3. In the Enter customer information screen, select the Account ID for a user with the Standard coverage level.
    Note: Selecting a user with Gold coverage does not display the Enter Payment Information View during Case processing.
    image which shows the coverage level of the customer
  4. Advance the Case to the Review assistance request View to display the information that you entered in previous Views.
  5. Toggle the Design mode.
    Design mode toggle button
  6. Under the New Assistance Request label, hover over the Section and then click the Edit this Section icon.
    New Assistance Request view design mode
  7. In the right pane, in Create Main list, select Review assistance request to open the Section configuration pane.
    configuration pane section menu
  8. In the right pane, click Change to change the template. The Select a template window is displayed.
    image shows change icon
  9. In the Select a template window, click Mobile page with content and layout group.
    Note: The Mobile page with content and layout group template can be used to implement the View with a layout group from App Studio.
  10. Drag and drop all the Sections to the B (Grouped - Tab) region.
    image shows change icon and regions in the template

3 Change the Section labels

  1. In the B (Grouped - Tab) region, click the edit icon for the Enter customer information Section.
    Click edit
  2. In the right pane, click Settings.
  3. In the Container settings section, in the Title field, enter Customer information.
    Customer information settings
  4. Click Apply, and then click Close.
  5. In the top of the right pane, in the list, select Identify location to open the Section pane.
  6. Repeat steps 2 through 4 to change the labels for the remaining Sections:
    Section Title
    Identify Location Service address
    Identify Vehicle Vehicle information
    Enter Payment Information Payment information
  7. Click Close and toggle the Design mode.

Confirm your work

  1. In the Review assistance request screen, click each tab to display the customer, service address, vehicle, and payment information.
  2. Confirm that the information is read-only.
    image showing review screen

This Challenge is to practice what you learned in the following Module:

Available in the following missions:

Return to mission Continue mission
If you are having problems with your training, please review the Pega Academy Support FAQs.

Did you find this content helpful?

Yes
No

Want to help us improve this content?
Suggest an edit

We'd prefer it if you saw us at our best.

Pega Academy has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice