1. Developing Applications with Oracle Visual Builder in Oracle Integration 3
  2. Develop Applications
  3. Work With Components
  4. Add Components to Pages
  5. Use Converters to Change Date and Time Formats and Time Zones

Use Converters to Change Date and Time Formats and Time Zones

You can use converters to change how date-time, date, and time components display their data, or to convert one time zone to another.

To convert time zones, times must be stored as strings, using the ISO 8601 time format.

Note:

The ISO “Zulu time” format (for example, 2022-01-12T04:00:00Z) is recommended for storing date and time values, as they remain consistent regardless of time zones.
There are two ways to convert date and time formats, and to convert one time zone to another:
  • Use the component’s built-in converter
  • Assign a converter function to the component

While you can use either method for the Input Date Time, Input Date, and Input Time components, you must assign a converter function for Date Time Picker and Inline Date Picker components.

To create your own converter function:
  1. Open the page’s JavaScript editor.
  2. Include the Oracle Jet IntlDateTimeConverter API.
  3. Create your converter function with a date input parameter (date is automatically passed in) and by using the IntlDateTimeConverter API, as shown here:
    Description of converter-function.png follows
    Description of the illustration converter-function.png

To assign a converter function to an Inline Date Time Picker and Inline Date Picker component:
  1. In the Designer, click the component, then click the All tab.
  2. Hover over the Converter field and click Select Variable:
    Description of converter-assign.png follows
    Description of the illustration converter-assign.png

To change the date/time format for an Input Date Time, Input Date, or Input Time component:
  1. In the Designer, click the component, then find Converter in the Properties pane’s General tab:
    Description of input-date-time-converter.png follows
    Description of the illustration input-date-time-converter.png

  2. From the Converter list, choose a value:
    • Short, Medium, Long, or Full, if you want a predefined format
    • Pattern, to specify a pattern for the format (like MM/dd/yy hh:mm)
    • Custom, to provide formatting parameters to the built-in converter, or to assign your own converter function to the component.

    If you chose anything other than Custom, your work is done.

  3. If you chose Custom, provide the parameters for the built-in converter, OR select your own converter function: