The field-value list component displays a list of attributes and their corresponding values. The data in a field-value list is non-editable.
Usage
Field-value lists in forms differ from readonly inputs. Unlike readonly inputs, field-value lists are used only to display static information for users to reference or review. For example, if an agent must reference a customer’s transaction history to file a dispute, a field-value list can display this information. Field-value lists can also display form details users previously entered, so users can verify information before submitting.
Field-value lists are most commonly found in a case’s summary panel or its details tab panel, although they can be used anywhere within an application that allows fields to be configured. Fields are typically arranged on screen in two columns from left to right. However, some field value list items are arranged from top to bottom, such as paragraphs of text, items that contain images, and other large content. Nested fields can be a mix of these two arrangements within the same list.
Display options
Inline
Inline field-value lists stack into two columns, with the descriptor text to the left and matching value text to the right.
Stacked
Stacked field-value lists stack information in one column, with the value text displayed below its respective descriptor.
Value-comparison
Value-comparison field-value lists render information similar to an inline field-value list, with the main difference being the introduction of horizontal lines separating each data entry. This format should be reserved for numerical data.
Configuration
To learn how to configure this component in a Pega application, visit Pega Documentation.
All information on this site is for Pega’s UX design system, also known as Constellation (from 8.8 and onwards). If you have questions, concerns, or any other feedback, please reach to us on Pega Support and include the capability ‘User Experience’ and ‘Constellation’ in your request.
Related components