Localizable Dates in Web UI

While STEP handles ISO dates better than localized dates when doing search, compare, and order operations, many users want to view localized dates and times displayed when they are in the Web UI.

Attributes with 'ISO Date' and 'ISO Date and Time' validation types can be configured to display in a localized format when set up to display using an Attribute Value, Parent Value, and Attribute Value Group Component within a Node List or while displayed using an Attribute Value and Attribute Value Group Component within a Node Editor.

Just like the Web UI localization of the Date attribute, which is shown localized by default, the locale is defined by the selection made during login or, once logged in, from the User Settings menu.

Dates converted to locale will follow the DateFormat.SHORT Java formatting style. Times converted to locale will be the DateFormat.MEDIUM formatting style.

Locale Date and Time (DateFormat) Samples English (United States) Danish (Denmark) French (France)
Date (SHORT) 8/14/15 14-08-15 14/08/15
Time (MEDIUM) 11:25:40 AM 11:25:40 11:25:40

Localization Setup

To localize the 'ISO Date' and 'ISO Date and Time' attributes displayed in Web UI, follow these steps.

  1. Log in to the Web UI. User must have privileges to edit Web UI configurations.
  2. Click the 'Design Mode' launch button found on the homepage (in the User Widget) or from the toolbar in the top right.

  1. Navigate to the Node Editor or Node List properties screen to add / edit the date attributes.
  2. Click on Add button in Child Components section.

  1. On the Attribute Value Component, Parent Value, or Attribute Value Group Component properties screens (for Node Editor) or the Attribute Value Header and Attribute Value Group Header properties screens (for Node List), click on the Advanced arrowhead to expand the Advanced options.
  2. Click on the box to the right of Enable Locale Formatting.
  3. Select the required Attribute in Attribute option on Attribute Value Component Properties.
  4. Click the Add button.
  5. Save and close the Node Editor / Node List properties screen.

The dates will now show as localized on the screen. The values will continue to display localized based on the login locale until the Enable Locale Formatting parameter is disabled.

The below example explains using Attribute Value Component in Node Editor Properties screen.

As an example, this is an attribute with an 'ISO Date' Validation Base Type prior to localization as shown in Web UI designer mode:

Under Advanced, the properties screen is now configured to localize the selected attribute.

This is the same 'ISO Date' Validation Base Type attribute after being localized (English / US locale):

Also, for example purposes, this is an 'ISO Date and Time' attribute before and after Enable Locale Formatting is selected.

Note: Follow the above steps to configure Attribute Group Component in Node Editor Properties Screen. To View the display of ISO date on other context, change the locale on the Login page.

The below example explains using Attribute Group Header Component in Node List Properties screen. The Multi Edit Display Mode is used in the example below:

  1. Navigate to the Node List Properties screen.
  2. Click on 'Multi Edit Display Mode' in Child Component of Node List, or Add the 'Multi Edit Display Mode.'
  3. In Multi Edit Display Mode Properties, Add 'Attribute Value Group' or 'Attribute Value Group Header' in Headers section.

4. In Attribute Value Header Properties screen, check the check box of Enable Locale Formatting option.

5. Select the required Attribute in Attribute option in Attribute Value Component Properties.

6. Click on Add button.

Considerations and Limitations

  • Date localization only works on attributes with these validation base types: Date (DD-MON-YYYY), ISO Date (YYYY-MM-DD), and ISO Date and Time (YYYY-MM-DD HH24:MI:SS). Changing the way these attributes display in Web UI does not impact the validation base type.
  • Web UI ISO Date display settings are configured per component and display mode, meaning that they must be individually set in each instance where the localized display is desired.
  • For information regarding converting existing attributes from Date to 'ISO Date' validation type, refer to the Converting Attributes from Date to ISO Date topic in the System Setup documentation.
  • For information regarding Localization, refer to the Localization topic in the Administration Portal documentation.