Skip to main content


         This documentation site is for previous versions. Visit our new documentation site for current releases.      
 

Dropdown control Properties - Presentation tab

Updated on November 15, 2021
Applicable to Theme UI-Kit applications

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.

FieldDescription
Edit Options Select an edit mode for this control. The edit mode of the control takes precedence over section and harness settings.
  • Auto - the control uses the edit mode of the section or harness in which it appears. If the section is set to Read Only, then the control is Read Only. If the section is set to Auto, then the control uses the edit mode of the harness. For example, a New harness is editable, while a Review harness is read only.
  • Read Only (always) - The property value is presented in read-only mode always even when the enclosing layout is in read-write mode. or based on a when condition rule or client-side test, even when the enclosing layout is in read-write mode.
  • Read Only (expression) - The property value is presented in read-only mode based on a client-side test. Enter a simple expression based on the comparison of a pair of constants, properties, or both, combined by Boolean operators, such as .Color="Red". You can combine the expression with a when condition rule or another expression using the && and || operators.

    As a best practice, use the Condition Builder to edit this field. Click the Open condition builder icon to open the tool.

  • Read Only (when) - The property value is presented in read-only mode based on a when condition. Enter the When Name key part of a when condition rule. Click the Open icon to review or create the rule.
  • Editable - the control is editable, regardless of the edit mode of the enclosing layout.
Read only values For read-only formats, select to display one of the following:
  • Display text of selected option - displays the caption value of the selected option
  • Property value - displays the value of the selected property
  • Another property's value - displays the value of the property that you specify. In the field that displays, select the property for which you want to display the value.
Specify size Specifies the width of the drop-down list.

Select Auto if you want the layout to determine the width of the control area. This is the default. If you want to specify a fixed width for the drop-down, select Custom and then specify the width in pixels or percentage.

Control format

Specifies the format of the drop-down list. You can style drop-down controls and create additional formats in the skin rule. To select a custom format, press the down arrow and select Other.

Label format Specifies the format of the drop-down labels.
Read-only format
Type

Select a format (read-only) used with this property. Your selection filters the format options.

Group/SelectionDescription
NoneThe property is not formatted. There are no options.
Date Renders DateTime and Text property types in date-only format (hours and minutes are not displayed). See Understanding the Date, Time of Day, and DateTime property types.

Specify the format in the Date Format field.

Date/Time Renders DateTime and Text property types in date and time format. See Understanding the Date, Time of Day, and DateTime property types.

Specify the format in the DateTime Format field.

NumberNumeric properties on output.
TextUnedited text, which may contain spaces, tabs, line break characters, and other control characters.
True/False Boolean values.

Specify the format in the True Label and False Label fields.

EmailOpens the email application.
PhoneDials the number on mobile devices.
URLOpens the URL in a browser.
DateTime Format

or

Date Format

Appears if Type is Date/Time or Date.Text Alignment Appears if Type is Number.

Select left, right, or center alignment.

Decimal Places Appears if Type is Number.

A non-negative integer to control the number of digits presented after the decimal place. The default is Auto, which displays a maximum of three decimal places (placeholder zeroes are not added). Select to remove all digits after the decimal point and round to the nearest integer. Select All to include all digits.

Rounding Method Appears if Type is Number. Select one of the following:
  • Round to nearest even number - Partial values are rounded to nearest even number. For example +5.5 rounds up to +6; +6.5 rounds down to +6.
  • Round up to nearest - Partial values are always rounded up. For example, +5.5 rounds up to +6; +6.5 rounds up to +7.
Scale Appears if Type is Number.

Select a label indicating the scaling you wish to apply to the number. The scales are K for thousands, M for millions, B for billions, and T for trillions. For instance, if you select Thousands, a value of 20,000 appears as "20 K." If Percentage, the value appears as a percentage sign (.8 appears as "80%").

Negative Format Appears if the Type is Number.

Select a format (minus sign or parenthesis) for displaying negative numbers.

You can also specify a CSS class if you select one of the Style Ref options. By default, the class name is NegativeNumber.

Symbol Appears if Type is Number. When a symbol is specified an additional character(s) is prepended to the value. Currency automatically uses the localized currency symbol, constant uses a string, and reference uses a property value.

Select an option for representing the number as

  • Currency - Formats the number as a currency using the default locale.
  • Constant - A text string or character (for example, "%") ASCII character that you enter.
  • Reference - A property value.
Separators Appears if Type is Number.

Select to use a thousands' separator. Depending upon the default locale, a comma or period is used.

Obfuscated

Appears if the Read-only format Type is Text.

Select Yes if you want the characters entered by the user to appear as a string of bullets. The input characters are initially added to the clipboard as unencrypted, clear text values. The system computes the hashed value only as the page is committed to the PegaRULES database. Thereafter, the hashed value appears in both the clipboard and the database row.

Auto Prepend Appears if Type is Text and the control is not obfuscated.

Select a property or constant that you want to add either before the displayed property value. For example, when the user name appears, the system can automatically prepend the user's title.

Auto Append Appears if Type is Text and the control is not obfuscated.

Select a property or constant that you want to add after the displayed property value. For example, when the user name appears, the system can automatically append the full mail extension to the name.

Show Value As Appears if the Type is True/False.

Select to label either outcome using Text or an Image.

True Image

False Image

Appears if the Type is True/False and Show Value As Image is selected.

Select an image to label either outcome. Used with a boolean type.

True Text

False Text

Appears if the Type is True/False and Show Value As Text is selected.

Enter a text string to label either outcome. Used with a boolean type.

If the Localize? check box is selected on the section's HTML tab, a SmartPrompt Appears in the Constant field in the Parameters dialog. Select a field value rule if you plan to localize the text. If this text is to be localized, enter no more than 64 characters. A field value rule with pyCaption as the second key part and this text as the final key part is needed for each locale.

Advanced Presentation OptionsInstead of creating a new custom format in the skin, you can adjust elements in a cell by applying Cascading Style Sheet (CSS) helper classes. For example, you can use a CSS helper class to center an element in a cell or to double the standard right margin for the element. 

Have a question? Get answers now.

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

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.com is not optimized for Internet Explorer. For the optimal experience, please use:

Close Deprecation Notice
Contact us