16.6 Managing Component Settings

Use Component Settings to set application level values for built-in Application Express components and installed plug-ins.

Tip:

The Component Settings in your environment will vary based on the currently selected application.

• Configuring Component Settings
  Configure Component Settings to set application-level values for built-in Application Express components and installed plug-ins.
• Integrating with Google Calendar
  Enable calendars within an application to integrate with Google calendar data by configuring the Component Settings, Calendar.
• Configuring Checkbox
  Configure Checkbox application-level component settings defined in Shared Components, Component Settings.
• Configuring Color Picker Display
  Configure Color Picker application-level component settings defined in Shared Components, Component Settings.
• Configuring Date Picker
  Configure Date Picker application-level component settings defined in Shared Components, Component Settings.
• Configuring Geocoded Address
  Configure the Geocoded Address application-level component setting defined in Shared Components, Component Settings.
• Configuring Interactive Report Action Menu Structure
  Configure interactive report application-level component settings to determine whether to use the new Action Menu or keep the legacy structure from earlier releases.
• Dynamically Adding Sliders to Regions
  Configure Region Display Selector application-level component settings defined in Shared Components to dynamically add a slider to the region if the displayed region name exceeds the width of the region.
• Configuring Rich Text Editor Responsiveness
  Configure Rich Text Editor application-level component settings to determine whether the Rich Text Editor automatically adjusts to the width of the container region.
• Configuring Star Rating
  Configure Star Rating application-level component settings defined in Shared Components, Component Setting.
• Configuring Switch Defaults
  Configure Switch item type application-level component settings defined in Shared Components, Component Settings.
• Viewing the Component Settings History Report
  You can view a report of modifications made to Oracle Application Express components and installed plug-ins on the Component Settings History page.

16.6.1 Configuring Component Settings

Configure Component Settings to set application-level values for built-in Application Express components and installed plug-ins.

Tip:

To learn more about a specific component type, see the sections that follow.

To configure Component Settings:

1. On the Workspace home page, click App Builder.
2. Select an application.
3. On the Application home page, click Shared Components.

   The Shared Components page appears.

4. Under Other Components, click Component Settings.
5. On the Component Settings page, click the component name.
6. In the Component Settings configure the appropriate settings and click Apply Changes.

   Tip:

   To learn more about a specific setting, see item Help.

16.6.2 Integrating with Google Calendar

Enable calendars within an application to integrate with Google calendar data by configuring the Component Settings, Calendar.

Note:

The Google Calendar API Key [Deprecated] attribute described in this topic only applies to calendars based on the FullCalendar v3 library. Calendars based on FullCalendar v3 have been deprecated and will be desupported in a future release. New calendars created in App Builder are based on the FullCalendar v5 library.

To configure the Component Settings, Calendar:

1. On the Workspace home page, click App Builder.
2. Select an application.
3. On the Application home page, click Shared Components.

   The Shared Components page appears.

4. Under Other Components, click Component Settings.
5. On the Component Settings page, click Calendar.
6. In the Component Settings dialog:
   1. Google Calendar API Key [Deprecated] - Enter the Google Calendar API key to enable calendars within this application to integrate with Google calendar data.
   2. Click Apply Changes.

16.6.3 Configuring Checkbox

Configure Checkbox application-level component settings defined in Shared Components, Component Settings.

To configure Checkbox application-level component settings:

1. On the Workspace home page, click App Builder.
2. Select an application.
3. On the Application home page, click Shared Components.

   The Shared Components page appears.

4. Under Other Components, click Component Settings.
5. On the Component Settings page, click Checkbox.
6. In the Component Settings dialog:
   1. Checked Value - Enter the value stored in the page item if the end user checks the checkbox. The value can be up to 255 characters long.
   2. Unchecked Value - Enter the value stored in the page item if the user deselects the checkbox. This attribute can also be left blank if you want to store NULL when checked. The value can be up to 255 characters long.
   3. Click Apply Changes.

16.6.4 Configuring Color Picker Display

Configure Color Picker application-level component settings defined in Shared Components, Component Settings.

To configure Color Picker application-level component settings:

1. On the Workspace home page, click App Builder.
2. Select an application.
3. On the Application home page, click Shared Components.

   The Shared Components page appears.

4. Under Other Components, click Component Settings.
5. On the Component Settings page, click Color Picker.
6. In the Component Settings dialog:
   1. Display As - Select how the color picker displays. Options include:

      • Popup - A color can be entered in the text field or chosen from the popup color picker.

      • Inline - A color picker is shown inline.

      • Color-only Popup - A button opens a popup color picker.

      • Native Color Picker - A native browser color input. The UI is dependent on the browser.

   2. Mode - Select the amount of information shown in the color picker. Options include Simple or Full.

      • Simple - Shows just the color spectrum controls and color presets if any are defined.

      • Full - Shows additional fields to view or enter colors as Hex, HSL, or RGB values with optional Alpha value depending on Return Value As. Also shows the Initial and Current colors.

   3. Click Apply Changes.

16.6.5 Configuring Date Picker

Configure Date Picker application-level component settings defined in Shared Components, Component Settings.

To configure Date Picker application-level component settings:

1. On the Workspace home page, click App Builder.
2. Select an application.
3. On the Application home page, click Shared Components.

   The Shared Components page appears.

4. Under Other Components, click Component Settings.
5. On the Component Settings page, click Date Picker.
6. In the Component Settings dialog:

   1. Appearance - Control the appearance of the calendar used to select dates. Options include:

      • Show Week

      • Month Picker

      • Year Picker

      This attribute is only used if Display As is set to either Popup or Inline.

   2. Days Outside Month - Dictates the behavior of days outside the current viewing month. Options include:

      • Hidden - Days outside the current viewing month will be hidden.

      • Selectable - Days outside the current viewing month will be visible and selectable.

      • Visible - Days outside the current viewing month will be visible.

      This attribute is only used if Display As is set to either Popup or Inline.

   3. Time Increment - Time increment in minutes used by the time selection control. This attribute is used for selecting the time of increments that can still be manually entered and saved.

      This attribute is only used when Display As is set to either Popup or Inline and Show Time is enabled.

   4. Show On - Controls when the calendar popup is displayed.

      This option is only used when Display As is set to either Popup or Inline and in addition Show Time is enabled.

      Options include:

      • Item Focus - When the item receives focus or when the calendar icon is clicked.

      • Icon Click - Only when the calendar icon is clicked.

   5. Click Apply Changes.

16.6.6 Configuring Geocoded Address

Configure the Geocoded Address application-level component setting defined in Shared Components, Component Settings.

To configure Geocoded Address application-level component settings:

1. Navigate to the Shared Components page:
   1. On the Workspace home page, click App Builder.
   2. Select an application.
   3. On the Application home page, click Shared Components.

      The Shared Components page appears.

2. Under Other Components, click Component Settings.
3. On the Component Settings page, click Geocoded Address.
4. Configure the following Component Settings:
   1. Geocoder Match Mode - Determines how closely the attributes of an input address must match the data being used for geocoding. Options include:

      • Exact - All provided address parts must match. However, if the house number, street name, or street type do not all match, the first match in the following is returned: postal code, city or town, and state. For example, if the street name is incorrect but a valid postal code is specified, a location in the postal code is returned.

      • Relax Street Type - The provided street type can be different from the data used for geocoding. For example, Main Street or Main Blvd match Main St, if there is no other Main Blvd or Main Street in the relevant area.

      • Relax House Number - The house number and street type can be different from the data used for geocoding. For example, 123 Main St matches 123 Main Lane and 124 Main St, as long as there are no ambiguities or other matches.

      • Relax Street Name - The base name of the street, the house number, and the street type can be different from the data used for geocoding. For example, Pleasant Vale matches Pleasant Valley as long as there are no ambiguities or other matches in the data.

      • Relax Postal Code - The postal code (if provided), street name, street type and house number can be different from the data used for geocoding.

      • Relax All - The address can be outside the city specified as long as it is within the same county. Also includes the characteristics of Relax Postal Code.

   2. Display As - Select how the geocoding results are displayed. Options include:

      • List View - The results display in a list view.

      • Grid View - The results display in a grid view.

   3. Map Preview - Determines whether to support previewing the geocoded address on a map. Options include:

      • Results Popup - Show the map in the Geocoding results popup, so that users can review the position before selecting a result. This is only supported when Display As, Grid View is enabled.

      • Item - Show a map visualizing the address location at the item position.

   4. Background - Pick the background map to show geocoding results on. Options include:

      • Default

      • OpenStreet Map Bright

      • OpenStreet Map Dark

      • OpenStreetMap Positron

      • Oracle World Map

      See item Help for more details.

   5. Height - Specify the height (in pixels) of the displayed map. Map's default height is calculated based on it's width with an 3:2 aspect ratio.
   6. Click Apply Changes.

16.6.7 Configuring Interactive Report Action Menu Structure

Configure interactive report application-level component settings to determine whether to use the new Action Menu or keep the legacy structure from earlier releases.

The structure of the interactive report Actions menu has changed to be consistent with interactive grids.

To configure interactive report application-level component settings:

1. On the Workspace home page, click App Builder.
2. Select an application.
3. On the Application home page, click Shared Components.

   The Shared Components page appears.

4. Under Other Components, click Component Settings.
5. On the Component Settings page, click Interactive Report.
6. In the Component Settings dialog:

   1. Actions Menu Structure - Specify how the Actions menu displays in interactive reports. Options include:

      • Interactive Grid - Select Interactive Grid to have the interactive report Actions menu match interactive grid.

      • Legacy - Select Legacy to have the interactive report Actions menu use the legacy structure.

   2. Click Apply Changes.

16.6.8 Dynamically Adding Sliders to Regions

Configure Region Display Selector application-level component settings defined in Shared Components to dynamically add a slider to the region if the displayed region name exceeds the width of the region.

To configure Region Display Selector application-level component settings:

1. Navigate to the Shared Components page:
   1. On the Workspace home page, click App Builder.
   2. Select an application.
   3. On the Application home page, click Shared Components.
      The Shared Components page appears.
2. Under Other Components, click Component Settings.
3. On the Component Settings page, click Region Display Selector.
4. In the Component Settings dialog:

   1. Include Slider - Select Yes to dynamically add a slider to the region if the displayed region name exceeds the width of the region.

   2. Click Apply Changes.

16.6.9 Configuring Rich Text Editor Responsiveness

Configure Rich Text Editor application-level component settings to determine whether the Rich Text Editor automatically adjusts to the width of the container region.

Tip:

This setting requires a responsive application theme (such as Universal Theme). For new apps, this setting is enabled by default. For older apps (pre-18.1), this is disabled by default.

To configure Rich Text Editor application-level component settings:

1. Navigate to the Shared Components page:
   1. On the Workspace home page, click App Builder.
   2. Select an application.
   3. On the Application home page, click Shared Components.

      The Shared Components page appears.

2. Under Other Components, click Component Settings.
3. On the Component Settings page, click Rich Text Editor.
4. In the Component Settings dialog:
   1. Responsive [Deprecated] - Specify whether the Rich Text editor should automatically adjust to the container region size. This requires the Application to use Universal Theme or another responsive theme.

   2. Click Apply Changes.

16.6.10 Configuring Star Rating

Configure Star Rating application-level component settings defined in Shared Components, Component Setting.

To configure Star Rating application-level component settings:

1. On the Workspace home page, click App Builder.
2. Select an application.
3. On the Application home page, click Shared Components.

   The Shared Components page appears.

4. Under Other Components, click Component Settings.
5. On the Component Settings page, click Star Rating.
6. In the Component Settings dialog:
   1. Default Icon - Choose the default icon to use (such as fa-star, fa,-thumbs-up, or fa-database).
   2. Active Color - Default color for active stars.
   3. Inactive Color - Default color for inactive stars.
   4. Tooltip - The template for the tooltip when end users hover the mouse over the item. This rating value replaces the #VALUE# substitution (for example, the movie rating is #VALUE#).
   5. Click Apply Changes.

16.6.11 Configuring Switch Defaults

Configure Switch item type application-level component settings defined in Shared Components, Component Settings.

Display options include On/Off switch toggle, pill button, or select list.

To configure Switch application-level component settings:

1. Navigate to the Shared Components page:
   1. On the Workspace home page, click App Builder.
   2. Select an application.
   3. On the Application home page, click Shared Components.

      The Shared Components page appears.

2. Under Other Components, click Component Settings
3. On the Component Settings page, click Switch.
4. Configure the following Component Settings:
   1. Display Style - Options include:

      • Switch

      • Pill Button

      • Select List

   2. On Value - Enter the value stored in the page item if the end user picks the On option. The value can be up to 255 characters long.
   3. On Label - Enter the text displayed for the On option. If no text is entered, the system default label is used.
   4. Off Value - Enter the value stored in the page item if the user picks the Off option. The value can be up to 255 characters long. This value is used if the page item is populated with a value which does not match either the On Value or Off Value.
   5. Off Label - Enter the text displayed for the Off option. If no text is entered, the system default label is used.
   6. Click Apply Changes.

16.6.12 Viewing the Component Settings History Report

You can view a report of modifications made to Oracle Application Express components and installed plug-ins on the Component Settings History page.

To view the Component Settings History report:

1. Navigate to the Shared Components page:
   1. On the Workspace home page, click App Builder.
   2. Select an application.
   3. On the Application home page, click Shared Components.

      The Shared Components page appears.

2. Under Other Components, click Component Settings.
3. Click the History tab.

   The History page displays as an interactive report. To customize the report, use the Search bar at the top of the page.