Oracle Apex 实用笔记系列 7 - 用Region Selector实现标签功能

需求

在一已有一级Tab Set的Apex项目中，笔者被要求实现一个二级Tab Set。一个可行的方案是在一个页面中用一个Region Selector来实现。但是Region Selector有一些自己的特性，比如

第一个选项是Select All

如果从其他页面返回，无法记忆之前的选择项

所以这篇文章着重对以上特性的修改以期模拟标签页的实现。

步骤

1. 创建Page1, Page2, Page3
   1. 可使用Apex提供的向导实现页面的创建。
   2. 在Page2创建hidden item,比如P2_RETURN_TAB,设置value protected为No。 类似地，在Page3创建P3_RETURN_TAB；
2. 在Page1的设置
   1. 创建一个Hidden item，比如P1_REGION_SELECTOR, 设置value protected为No；
   2. 创建2个Region，需要注意的地方是在每个Region的配置中的Attribute页面，把Region Display Selector设置为Yes。 
   3. 由于Region1和Region2的Region Display Selector被设置为Yes，默认地，除了Region1和Region2的名称，有额外的一个Select All标签出现在标签行的第一项，并且它成为了被选中的那个；
   4. 创建一个Dynamic Action: Name: Selector Load; Event: Page Load; No condition；
   5. 创建一个True Action: Action:Execute Javascript Code;
   6. Code:

   7. $('.apex-rds li:first-child').remove();
      $('.apex-rds li:first-child').addClass('apex-rds-first');
      
      $selector=$v("P1_REGION_SELECTOR");
      if($selector==''){
      $selector='Region1'; 
      }
      
      $('span:contains('+$selector+')').parent().trigger('click');
                 

   8. 创建一个Dynamic Action: Name: Selector Click; Event: Click; Selection Type:JQuery Selector;jQuery Selector:.apex-rds a;No condition；
   9. 创建一个True Action: Action:Execute Javascript Code;
   10. Code:

   11. $selector=$(this.triggeringElement).find('span').text();
       $s('P1_REGION_SELECTOR',$selector);
                  

   12. 在Region1创建1个链接指向Page2,在链接中设置P2_RETURN_TAB的值为P1_REGION_SELECTOR的值。类似地，在Region2创建1个链接指向Page3,在链接中设置P3_RETURN_TAB的值为P1_REGION_SELECTOR的值。
3. 在Page2的设置
   1. 创建一个button. Action: Redirect to Page in this Application; Page: 1; Set These Items: P1_REGION_SELECTOR; With These values: &P2_RETURN_TAB.;
   2. 在Branch to Page or URL, Branch Point: On Submit:After Processing(After Computation, Validation and Processing); Target Type: Page in this Application; Page:1; Set These Items: P1_REGION_SELECTOR; With These values: &P2_RETURN_TAB.;
4. 在Page3的设置与在Page2的设置类似。

注意事项

本文是对复杂问题的简化，比如在Region1中到Page2的链接可以不是简单链接<a>而是Report中每一行的link。