Skip to main content

Adding a Drop-down control

Suggest edit Updated on December 13, 2021
Applicable to Theme UI-Kit applications

Use the Dropdown control to display a list of options, from which the user can select a single option. The list of options can be defined in a list bound to a property, or a clipboard page, a data page, or a report definition.

When the source is a clipboard page, data page, or a report definition, you can categorize items within the drop-down list.

When a drop-down list is bound to a data page or report definition that accepts parameters and the parameter value uses a property reference, the drop-down list automatically refreshes with new items whenever the property value changes. No additional configuration is required. This can be used to set up cascading drop-down menus or any combination of controls.

Upgrading to use the pxDropdown control

The Dropdown control in the Pickers list replaces the deprecated Select control. As a best practice, upgrade PromptSelect and DynamicSelect controls to drop-down controls.

If a section contains PromptSelect, DynamicSelect, or another control for which there is an improved alternative, a warning displays, along with an Update Controls button. Click Update Controls to automatically update deprecated controls in the section.

Note: Automatic update is not available for all controls; see Pega Community article Upgrading deprecated and outdated controls.

Adding a drop-down control

  1. On the Design tab, from the Pickers list, drag Dropdown onto the work area.

    If you are using a cell-based layout and you drag the control into a cell that is not empty, then the dropped control replaces the current contents of the cell.

  2. Click the View properties icon to display the Properties panel.
  3. On the Properties panel, define the drop-down list using the following tabs:

The UI Gallery landing page contains a working example of this element. To display the gallery, in Dev Studio, click ConfigureUser InterfaceGallery UI elements.

Copying, deleting, or moving a drop-down control

  • To move a drop-down control, hold down the SHIFT key, select the drop-down in the layout and drag and drop it in the new location.
  • To cut, copy, or paste a drop-down control in a layout, right-click the control to access a context-menu.

About Flow Actions

About Harnesses

About Sections

  • Dropdown control Properties — General tab

    Click the View properties icon in the layout containing the drop-down control ( pxDropdown ) to display the Properties panel, and then select the General tab to define the source of values in the drop-down list.

  • Dropdown control Properties — Presentation tab

    Click the View properties icon in the layout containing the drop-down control ( pxDropdown ) to display the Properties panel, and then select the Presentation tab to configure the display of the drop-down list.

Did you find this content helpful? YesNo

Have a question? Get answers now.

Visit the Support Center to ask questions, engage in discussions, share ideas, and help others.

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

Pega.com is not optimized for Internet Explorer. For the optimal experience, please use:

Close Deprecation Notice
Contact us