Skip to main content

Creating field groups in Constellation Views

6 Tasks

35 mins

Visible to: All users
Intermediate
Pega Platform '24.2
User Experience
Constellation
English

Scenario

Important aspects of the UI configuration for the Tell Us More application from Sweet Life Inc. are Field Groups and the Search and select pattern for navigating product list information. As a System Architect on the Sweet Life application project, you are tasked with configuring the Service Details and Product Details Views that incorporate these UI features.

Note: Complete the challenge Designing Views with Constellation before beginning this challenge.

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

Role User name Password
System Architect Author@SL 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.
Note: The challenge walkthrough video is coming soon. 

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

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

Detailed Tasks

1 Add fields to the Data Model of the Incident Case Type

  1. In the Pega instance for the challenge, enter the following credentials:
    1. In the User name field, enter Author@SL.
    2. In the Password field, enter pega123!
  2. In the navigation pane of App Studio, click Case Types > Incident to open the Incident Case Type.
  3. Click the Data Model tab.
  4. Add the following fields to the Data Model:
    Name Type Picklist options Choices
    What happened? Text (paragraph) Not applicable Not applicable
    When did this happen? Date only Not applicable Not applicable
    Communication channel Picklist Local In person, Email, Phone, and Postal
  5. Click Save.

2 Configure a Field Group and Validation in the Service Details View

  1. In the Incident Case Type, click the Workflow tab.
  2. Click the Service Issue Step to open the contextual properties pane on the right.  
  3. Click Configure View to open the Edit View: Service Details window.
  4. In the Fields section, click Add > Fields > Communication channel > Add to add the field to the View.
  5. Click Add, and then click Create Field Group.
    The Create field group link.
    Note: Field Groups are unique to the View in which they are created. For more information about Field Groups, see Configuring field groups.
  6. In the New Field Group window, enter the following information:
    1. In the Heading field, enter Incident details.
    2. In the Instructions list, select Show instructions.
    3. In the Instructions text field, enter Please answer the questions below.
    4. Click Submit.
      Add new field group
  7. In the Incident details Field Group row, click the Add icon.
    Add Field Group
  8. Click Fields, select the What happened? and When did this happen? checkboxes, and then click Add.
    Incident details field group
  9. To the right of Communication channel, click the Gear icon to display the Configure field: Communication channel window.
  10. In the Conditions section, in the Required field, select Always, and then click Save.
  11. Repeat Steps 9-10 for the What happened? and When did this happen? fields.
  12. In the Service Details window, click the Conditions tab.
    Conditions Tab
  13. Click Add condition, and then in the Message field, enter The date must be in the past.
  14. Create a Condition that states When did this happen? is after Today, and then click Submit.
    Add condition
    Note: For more information about building a custom Condition, see Defining Conditions in the Condition builder.
  15. Click Save.

3 Configure the Field Groups for the Product Details View

  1. In the Incident Case Type, click the UX tab.
  2. Click the Other Views tab, and then in the Form section, click the Product Details View.
  3. Click Add > Create Field Group to create a new Field Group with the following details:
    1. In the Heading field, enter Select product.
    2. In the Instructions list, select Show instructions.
    3. In the Instruction text field, enter Please select the product that was involved in the incident.
    4. Click Submit.
  4. Repeat step 3 to create a new Field Group with the following details:
    1. In the Heading field, enter Incident details.
    2. In the Instructions list, select Show instructions.
    3. In the Instruction text field, enter Please answer all of the questions below.
    4. Click Submit.
      Product Details Field Groups

 

Tip: This Incident details Field Group is unique to the Product Details View and is not related to the Incident details Field Group created for the Service Details View in Task 2 of this challenge.

4 Configure the Select Product Field Group

  1. In the Select product Field Group row, click Add, and then click Fields > Create new field.
  2. Create a new field with the following details:
    1. In the Name field, enter Product.
    2. In the Type list, select Data Reference.
    3. In the Data object list, select Product.
    4. In the Options section, select Single record.
    5. Expand the Advanced section, and then select the Reference data is copied to the Case checkbox.
    6. In the Data Page list, select Product.
    7. Click Submit.
  3. Click the Product field.
    Highlighting the Product field in the Select products field group.
  4.  In the Edit field: Product window, in the Input settings section, configure the following details:
    1. In the Mode field, select Single-select.
    2. In the Display as field, select Table.
    3. In the Data Page field, select List Product.
    4. In the Columns section, add the following columns to the view:
      • Name
      • SKU
      • Category Name
        Product field
  5. Click Back to return to the Product Details View.
  6. Add the Cost field to Select Product Field Group:
    1. In the Select Product Field Group row, click Add.
    2. Click Fields > Product > Fields > Cost > Add.
      Note: Click the arrow located to the right of a data object to access the associated fields and Views.
      Highlighting the arrow located to the right of the Product data object.
  7. In the Select product Field Group row, click Add, and then click Fields > Create new field.
  8. Create a new field with the following details:
    1. In the Name field, enter Proof.
    2. In the Type field, select Attachment.
    3. In the Attachment category field, enter Picture.
    4. In the Type field, select Single record.
    5. Click Submit.
  9. In the Proof field row, click the Gear icon. 
  10. In the Configure field: Proof window, complete the following details:
    1. In the Label value field, select Custom.
    2. In the Custom label value enter Proof.
    3. In the Helper text field, enter Please attach proof of issue.
      Configure field Proof
    4. Click Save.
      The following figure shows the configuration of the Select product Field Group:
      Select product field group

5 Configure the Incident details Field Group

  1. In the Incident details Field Group row, click Add.
  2. Click Fields, select the What happened? and When did this happen? checkboxes, and then click Add.
    Incident details field group
  3. Click Save.

6 Configure Validation on the Product Details View

  1. In the Incident Case Type, click the Workflow tab.
  2. Click the Product Issue Step to open the contextual properties pane on the right.
  3. Click Configure View to open the Edit View: Product Details window.
  4. In the Edit View: Product Details window, click the Conditions tab.
  5. Click Add Condition.
  6. Complete the following steps to create the conditional Validation:
    1. In the Message field, enter The date must be in the past.
    2. Create a Condition that states When did this happen? is after Today.
    3. Click Submit.
  7. Click Save.

Confirm your work

  1. In the header of App Studio, click Preview.
  2. Create a new Incident Case.
  3. In the Incident Type field, select Customer service issue, and then select an Incident SubType. Click Next.
  4. Review the content of the Service Issue View, specifically noting the contents of the Incident details Field Group.
    Service Issue Errors View
     
  5. In the When did this happen? field, enter a date that is in the future. Confirm that you receive error messages for the required fields and the incorrect date.
    Date error
  6. Cancel out of the existing Case and create a new Incident Case. 
  7. In the Incident Type field, select Product faulty or unsafe, and then select an Incident SubType. Click Next.
  8. Review the content of the Product Issue View, specifically noting the contents of the Select product and Incident details Field Groups.

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


Available in the following mission:

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

Did you find this content helpful?

Want to help us improve this content?

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