• No results found

Sort Order

In document User Application: Design Guide (Page 128-134)

List-based controls sort content alphabetically. For DN-based lists, the sort order is alphabetical based on the Display expression property result. For all other types, the sort order is based on the display label.

5.5.5 CheckBoxPickList

Use the CheckBoxPickList control to allow users to view and choose one or more values from a Property Name Description

Display label Specifies the label to display to identify the control. It is localizable.

Editable Specifies if the control is editable (True). Otherwise, it displays as read-only.

Events Specifies an event for the control. Possible values include the following:

 OnChange: Fires when one of the following occurs:

 Immediately after onload.

 Another script changes the value of the control.

 The user commits a change to the data value associated with the control. This occurs when the user has tabbed out of the control or otherwise caused it to lose focus. For example, this can happen when the user tabs away from the control (for text entry based controls like Text, TextArea, DatePicker), or when the user selects a different entry choice for choice-based controls like PickList, MVCheckbox, and StaticList).

 onLoad: The onload event for a control fires just once, when the control is loaded into the page for the first time. It can be used to set initial values or preselect entries; however, there is no guarantee that controls load in a particular order.

Multivalued This is a read-only property. It specifies if the control supports multivalue attributes (True).

Required Specifies whether the control requires user input (True).

Tooltip Specifies the text for the control’s tooltip. It is localizable.

Visible Specifies whether the control is displayed in the user interface (True).

Figure 5-10 Sample CheckBoxPickList Control

Table 5-7 CheckboxPickList Properties

Property Name Description

Entity Key for DN expression lookup When you populate this control with a DN retrieved from the Identity Vault and you want that value to display in a user-friendly fashion, you should choose an entity from the drop-down list and specify a set of attributes in the Display expression property.

Leave this value blank if you want to display the full DN or CN value retrieved from the Identity Vault.

The entity you choose must have the directory abstraction layer View property set to True and be the entity whose DN you are retrieving from the Identity Vault.

Display expression Required when you specify an Entity Key for DN expression Lookup. Choose the attributes to display as the check box labels.

For example, to display the user entity’s first and last name attributes, construct an expression like this: FirstName LastName.

The attribute’s directory abstraction layer properties for View, Read, Search, and Required must be set to True.

Allow multiple selections When this option is set to True, users can select more than one entry.

Field cell style Apply an HTML style attribute to the field body.

Example: padding-top:5px;background-color:red

Field CSS class name(s) Apply one or more CSS class styles to the field body. You can view the classes that are available for your User Application portal by logging into the User Application, navigating to Administration >

Application Configuration > Theme Administration, then clicking the Preview button for the portal theme you are using.

If you leave the field blank, it defaults to the nv-fontExtraSmall class.

Example: nv-fontMedium nv-backgroundColor3 Separate class names with spaces.

Label cell style Apply an HTML style attribute to the field label.

Example: color:red

5.5.6 DatePicker

Use this control for display and entry of a date and time. This allows users to choose a date from a pop-up calendar or type a date in a text field. At runtime, the form automatically validates the date by using the format for the user’s locale and time zone. If the user enters an incorrect format, the form displays an error message. The DatePicker control’s tooltip displays the valid date format. The default DatePicker control looks like this:

Figure 5-11 Sample DatePicker Control

When the Show date picker property is True, the form displays the date field along with a button.

When the user clicks the button, the form launches a calendar for the user to select the date. The calendar pop-up looks like this:

Figure 5-12 Sample Calendar Control

Label CSS class name(s) Apply one or more CSS class styles to the field label. You can view the classes that are available for your User Application portal by logging into the User Application, navigating to Administration >

Application Configuration > Theme Administration, then clicking the Preview button for the portal theme you are using.

If you leave the field blank, it defaults to the nv-formFieldLabel class.

Example: nv-color5

Separate class names with spaces.

Show 2 lists When this option is set to True, two lists are displayed, one for the unselected values and another for the selected values.

The Allow multiple selections property must be set to True. If set to False, Show 2 lists is ignored.

Sort entries When this option is set to True, sorts results in ascending order. For details, see “Sort Order” on page 128.

Property Name Description

Table 5-8 DatePicker Control Properties

5.5.7 DateTimePicker

Use this control for display and entry of a date and time for a Time data type. This allows users to choose a date and time from a pop-up calendar or type a value in a text field. At runtime, the form automatically validates the date and time by using the format for the user’s locale and time zone. If the user enters an incorrect format, the form displays an error message. The DateTimePicker tooltip displays the valid date format. The default control looks like this:

Figure 5-13 Sample DateTimePicker Control Property name Description

Datetime indicator When this option is set to False, the Calendar pop-up does not display the time.

Day headers A comma-separated, single-quoted list of values displayed by the Calendar pop-up to indicate the day of the week. This value is localizable.

Field cell style Apply an HTML style attribute to the field body.

Example: padding-top:5px;background-color:red Field CSS class

name(s)

Apply one or more CSS class styles to the field body. You can view the classes that are available for your User Application portal by logging into the User Application,

navigating to Administration > Application Configuration > Theme Administration, then clicking the Preview button for the portal theme you are using.

If you leave the field blank, it defaults to the nv-fontExtraSmall class.

Example: nv-fontMedium nv-backgroundColor3 Separate class names with spaces.

Field Width in pixels Use this field to configure the field’s visible width on the form. The default is 200 pixels.

Label cell style Apply an HTML style attribute to the field label.

Example: color:red Label CSS class

name(s)

Apply one or more CSS class styles to the field label. You can view the classes that are available for your User Application portal by logging into the User Application,

navigating to Administration > Application Configuration > Theme Administration, then clicking the Preview button for the portal theme you are using.

If you leave the field blank, it defaults to the nv-formFieldLabel class.

Example: nv-color5

Separate class names with spaces.

Month names A comma-separated, single-quoted list of values displayed by the Calendar pop-up to indicate the month name. This value is localizable.

Show date picker When this option is set to True, displays the calendar pop-up. If it is set to False, the calendar pop-up does not display. Users must type the date in the text field by using the proper format for their locale.

When the Show date picker property is set to True, the form displays a text field followed by a calendar button. When the user clicks the calendar button, the form launches a calendar control for the user to select the date and time values. The calendar pop-up looks like this:

Figure 5-14 DateTimePicker Calendar Control

Table 5-9 DateTimePicker Control Properties

5.5.8 DNContainer

Use this control to allow users to select a container object from within the root container that you specify. You can use this control to limit the user to a subtree of a container. This is a specialized version of the DNLookup control.

Figure 5-15 DNContainer Control With Root Container Specified Property name Description

Day headers A comma-separated, single-quoted list of values displayed by the Calendar pop-up to indicate the day of the week. This value is localizable.

Field width in pixels Use this field to configure the field’s visible width on the form. The default is 200 pixels.

isDateTime When this option is set to False, the Calendar pop-up does not display the time.

Month names A comma-separated, single-quoted list of values displayed by the Calendar pop-up to indicate the month name. This value is localizable.

Show date picker When this option is set to True, it displays the calendar pop-up. If it is set to False, the calendar pop-up does not display. Users must type the proper format for the locale when they type the date in the text field.

Table 5-10 DNContainer Control Properties

Property name Description

Entity key used for object lookup Choose an entity from the drop-down list. The entity that you choose limits the users ability to look up objects within the specified entity’s container. If you specify an entity key and a root container, the entity key takes precedence.

Field cell style Apply an HTML style attribute to the field body.

Example: padding-top:5px;background-color:red

Field CSS class name(s) Apply one or more CSS class styles to the field body. You can view the classes that are available for your User Application portal by logging into the User Application, navigating to Administration > Application

Configuration > Theme Administration, then clicking the Preview button for the portal theme you are using.

If you leave the field blank, it defaults to the nv-fontExtraSmall class.

Example: nv-fontMedium nv-backgroundColor3 Separate class names with spaces.

Field width in pixels Use this field to configure the field’s visible width on the form. The default is 200 pixels.

Label cell style Apply an HTML style attribute to the field label.

Example: color:red

Label CSS class name(s) Apply one or more CSS class styles to the field label. You can view the classes that are available for your User Application portal by logging into the User Application, navigating to Administration > Application

Configuration > Theme Administration, then clicking the Preview button for the portal theme you are using.

If you leave the field blank, it defaults to the nv-formFieldLabel class.

Example: nv-color5

Separate class names with spaces.

Root container Specify a root container for lookups when users click the Object Selector button.

Show clear button

If set to True, the form displays the Reset field button Show object history button

If set to True, the form displays the Show history button.

Show object selector button

If set to True, the form displays the Object Selector button.

In document User Application: Design Guide (Page 128-134)