Region and Region IDs

What's Region and Region IDs

A region is a plug or an area on a page using DIV tags as a container of other page components.

There are many IDs for a region in different phases. Here below is a RDS(Region Display Selector) region with the Standard template.


I would like to define them as following:
-- ID is the unique ID in database referring to section 1 in the picture.
-- So the ID of Region Display Selector in page 88 is 1421721788170690390.
ID := to_char(apex_application_page_regions.region_id);

-- cID is a fixed class for substitution string #REGION_CSS_CLASSES# in HTML div tag.
-- Here in the section 3, the value of cID is lto1421721788170690390_0.
cID := 'lto' || ID || '_0';

-- rID is a fixed value for substitution string #REGION_ID# in HTML div tag.
-- rID here is R1421721788170690390. 
rID := #REGION_ID# := 'R' || ID; 

-- sID is generated region ID in HTML div tag. It will be either the region's Static ID if defined, 
-- or if not will be an internally generated ID in the format 'R' || [Internal Region ID]. 
-- According to section 1, the STATIC_ID is null, so here sID is rID, R1421721788170690390 as displaying in section 3. 
sID := #STATIC_REGION_ID# := case apex_application_page_regions.static_id 
                             when null then rID 
                             else apex_application_page_regions.static_id 
                             end; 

-- iIDs are IDs generated in #BODY# substitution string and containing ID or STATIC_ID in HTML. 
-- Here in section 3, 1421721788170690390_RDS is one of iIDs. 
iIDs := inner IDs;

-- noID means there is no any of IDs above existing in HTML for specific region. 
-- Here if in section 3, there is no ID, cID, rID, sID or any of iIDs listed above, I will name noID. 
noID := null; -- there is not any of IDs above existing in HTML for specific region

Region IDs in various scenarios 

                                                                          Region IDs when template selected          Region IDs
REGION TYPE                           PLUG_SOURCE_TYPE                    #STATIC_REGION_ID#  #REGION_CSS_CLASSES#   when No Template
-----------------------------------   ---------------------------------   ------------------  --------------------   -------------------
Breadcrumb                            NATIVE_BREADCRUMB                            sID         cID                   noID
Calendar                              NATIVE_CSS_CALENDAR                          sID         cID                   sID
Chart                                 NATIVE_JET_CHART                             sID         cID                   iIDs and Region not display
Classic Report                        NATIVE_SQL_REPORT                            sID         cID                   iIDs
Classic Report (based on Function)    NATIVE_FNC_REPORT                            sID         cID                   iIDs
Data Upload Column Mapping            NATIVE_DATA_UPLOAD_COLUMN_MAPPING            sID         cID                   noID
Help Text                             NATIVE_HELP_TEXT                             sID         cID                   noID
Interactive Grid                      NATIVE_IG                                    sID         cID                   iIDs
Interactive Report                    NATIVE_IR                                    sID         cID                   sID
List                                  NATIVE_LIST                                  sID         cID                   noID
Map Chart                             NATIVE_FLASH_MAP                             sID         cID                   sID
PL/SQL Dynamic Content                NATIVE_PLSQL                                 sID         cID                   noID
Region Display Selector               NATIVE_DISPLAY_SELECTOR                      sID         cID                   iIDs
Static Content                        NATIVE_STATIC                                sID         cID                   noID
Tree                                  NATIVE_JSTREE                                sID         cID                   iIDs
URL                                   NATIVE_URL                                   sID         cID                   noID

Badge List [Plug-In]                  PLUGIN_COM.ORACLE.APEX.BADGE_LIST            sID         cID                   noID and region not display
Flot Pie Chart [Plug-In]              PLUGIN_COM.ORACLE.APEX.FLOT.PIE              sID         cID                   sID
HTML 5 Bar Chart [Plug-In]            PLUGIN_COM.ORACLE.APEX.HTML5_BAR_CHART       sID         cID                   iIDs
Mini Calendar [Plug-In]               PLUGIN_COM.ORACLE.APEX.MINICALENDAR          sID         cID                   iIDs
Slide Tooltip [Plug-In]               PLUGIN_COM_ORACLE_APEX_SLIDETOOLTIP          sID         cID                   iIDs
Translated Message [Plug-In]          PLUGIN_COM.ORACLE.APEX.TRANSLATED_MESSAGE    sID         cID                   noID
Tag Cloud [Plug-In]                   PLUGIN_COM.ORACLE.APEX.TAG_CLOUD             sID         cID                   noID
Actually, region IDs varies depending on region type defined and template selected, especially when no template assigned.
  • line 1-16 are default region types in APEX 5.1 and from line 18, they are some common region plugin. Here I don't check legacy or unsupported types.
  • when template assigned, all regions will contain sID and cID in HTML because substitution strings #STATIC_REGION_ID# and #REGION_CSS_CLASSES# are defined in all templates from Theme42 as default.
  • when there is no template selected for a region,  it becomes interesting. 
    • A Chart type region will not be displayed on a page even though there are iIDs generated for it. A Badge List [Plug-In] type region will not be displayed on a page and there are noID generated for it. Rendering failed.
    • noID: if define a Breadcrumb type region without a template selected, there will be noID generated but rendering normally.  Some other types are the same, such as Help Text, List, Static Content, and so on. The main reason is there is no any region IDs above used or referred in #BODY# content.
    • sID: there are some region types without template which still generate sID, such as Calendar, IR, Map Chart and Flot Pie Chart [Plug-In]. Normally, if sID generated, iIDs for region inner structure will be generated. But why? Why there is no template selected but these regions still generate sID? I suppose front-end logic (JS lib) relays on the div with sID and when rendering, database logic detect no template and then generate div with sID as reparation.
    • iIDs: Classic Report, IG, RDS, Tree, HTML 5 Bar Chart [Plug-In], Mini Calendar [Plug-In], and Slide Tooltip [Plug-In] will not generate sID but iIDs. That means these regions use sID to compose their inner HTML structure. 

How to quickly check if a template contains IDs?

In my previous post Locate Substitution String in clob Template column using regexp, there is a handy way to get this.

Which one is more reliable for jquery selector, sID or cID?

If a APEX application is using Theme42 without changing the default region templates, I would like to say cID is more reliable for jquery selector.  Because the value of cID is fixed and unique on one page.

How Plugin generates its IDs?

Utilizing the third function in my post Locate Substitution String in clob Template column using regexp will be able to find some clues. :)
-- change proper application_id
select r.application_id as app,
       t.line_number as l,
       t.column_index as c,
       t.attribute_string,
       to_char(r.display_name) as plugin_display_name
  from apex_appl_plugins r,
       table(utl_apex_substitutionstr.locate_orphan_substitutionstr(p_keywords => 'static_id',
                                                                    p_clob     => r.plsql_code)) t
 where r.application_id = 250
union all
select r.application_id as app,
       t.line_number as l,
       t.column_index as c,
       t.attribute_string,
       to_char(r.display_name) as plugin_display_name
  from apex_appl_plugins r,
       table(utl_apex_substitutionstr.locate_orphan_substitutionstr(p_keywords => 'STATIC_ID',
                                                                    p_clob     => r.plsql_code)) t
 where r.application_id = 250
 order by 1, 5, 2, 3
Output from SQLDeveloper:

Comments

Popular posts from this blog

RDS Customizable for APEX 5.1

Note for APEX 5.1 UI, Theme, Templates and Substitution Strings

Use Plugin Code Editor - Part 1/4: Demo