The Region Display Selector component includes a couple of new features since version 5.0 of Application Express. This article gives an overview of the features that have been introduced and I’ll also mention some useful JavaScript code snippets to gain extra control over a Region Display Selector component. Let’s start with the new declarative, out-of-the-box functionalities. The properties mentioned below can all three be found under the Attributes page of a RDS component.

Declarative features

1. Mode

The Mode property determines how regions, that are part of a RDS, are shown on the page. The following two options are available:

  1. View Single Region. This was the only possible mode in pre-APEX 5.0 versions. Clicking a tab from the RDS will make the corresponding region visible and automatically hide all other regions. That way you can solely focus on the selected region while not having to pay attention to other parts of the page.
  2. Scroll Window. This option has been introduced in APEX 5.0. When clicking a tab this time, the page will scroll down or up to display the selected region, without hiding the other regions. The application for example uses this mode extensively.
2. Include ‘Show All’

Yes/No property that is only applicable in case of a View Single Region mode. When selecting Yes, the RDS includes a Show All tab, which purpose is to show all regions that are part of the RDS. In pre-APEX 5.0 versions, the Show All tab was not configurable and thus always visible. That’s why I wrote this blog post in the past as a work around to get rid of the Show All tab.

3. Remember Last Selection

Another Yes/No property that lets you create the sticky tab behaviour as seen in the pre-APEX 5.0 application builder. If selecting Yes, the region that you last selected will be reselected on the next page load. Otherwise, the first selectable region will be automatically selected.

“Hidden” features

1. Find out what tab has been clicked

The following code snippet will give back the region ID after selecting a tab from the Region Display Selector.

$('.apex-rds').data('onRegionChange', function(mode, activeTab) {


2. Don’t jump to the top of the page after selection

To prevent being taken to the top of the page after selecting a tab, execute the following JavaScript code on page load.

$('.apex-rds').data('showAllScrollOffset', function() {
  return false;