Shortcuts
Next region
F9
Previous region
ShiftF9
Jump to toast
⌥Enter
Dismiss toast
⌥Q
Go to incoming interaction popup.
⌥Enter
Dismiss incoming interaction popup.
⌥Q

Number input

The number component allows the user to enter numerical data. Any other characters will be ignored. Number inputs are auto-formatted according to locale, while the user types.

Usage

The number component can be configured to include percentages and units (upper or lowercase).

By default, the component uses region-local separators for localization purposes.

New for 24.2: Now labels can use property references, making them dynamic; creating more personalized, engaging experiences.

For best practices on building forms with inputs in Constellation, visit Pega Academy.

Example

Enter a numerical value

Variations

Stepper input

The stepper component acts similarly to the number input component, enabling users to enter numeric values. However, it also allows users to interact with buttons to increase or decrease the value of the entered number in increments. Similar to the number component, a stepper allows for a min and max range, as well as a specified step increment value.

Example

To set the value use the up and down arrow keys or type the value
Enter a numerical value

Configuration

To learn how to configure this component in your Constellation application, visit Pega Documentation.

All information on this site pertains to the Constellation UX System (from 8.8 and onwards). Looking for something else? See resources specifically for Theme Cosmos. 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