Page help in modal dialog

To show help in modal dialog you need jQuery and SimpleModal jQuery plugin. Load SimpleModal library in page template header. If you are on APEX 3.x you need also load jQuery.

First create application item called G_HELP_URL. Set item Session State Protection to "Restricted - May not be set from browser". Then create application computation for this item.

• Computation Point: Before Header
• Computation Type: PL/SQL Expression
• Computation:

APEX_UTIL.PREPARE_URL (
  p_url => 'f?p=&APP_ID.:HELP:&APP_SESSION.:&APP_PAGE_ID.:NO:1500::',
  p_checksum_type => 3
);

In above code we make assumption that page showing help id will be 1500.

Then create HTML region to page zero.

• Template: No Template
• Display Point: After Header
• Region Source:

<script type="text/javascript">
function htmldbShowHelp(){
 $.modal($("<iframe/>",{
  "id":"htmldbIFrame",
  "src":"&G_HELP_URL.",
  "height":400,
  "width":600,
  "frameborder":0}),{
  overlayClose:true,
  containerCss:{
   background:"#FFF",
   padding:10,
   height:400,
   width:600
  },
  persist:true,
  overlayCss:{backgroundColor:"#606060"},
  onOpen:function(d){
   d.overlay.fadeIn("slow",function(){
    d.data.hide();
    d.container.fadeIn("slow",function(){
     d.data.slideDown("slow");
    });
   });
  },
  onShow:function(){
   $("#htmldbIFrame").load(function(){
    $(this).contents().find("input[type='button']:first").removeAttr("onclick").click(function(){
     $.modal.close();
    });
   });
  }
 });
}
</script>

Next create blank page to show help.

• Page Number: 1500
• Page Alias: HELP
• Page Name: Help

Do not select/set tabs or breadcrumbs for this page.

Edit page attributes:

• Template: Popup
• Cursor Focus: Do not focus cursor
• Page Access Protection: Arguments Must Have Checksum
• Form Auto Complete: Off

Create new PL/SQL Dynamic Content region and set Region Source:

APEX_APPLICATION.HELP(
  p_flow_id        => :APP_ID,
  p_flow_step_id   => :REQUEST,
  p_show_item_help => 'NO',
  p_show_regions   => 'NO'
);

Create CLOSE button to region. You can accept all wizard defaults, except set Button Style to "HTML Button". It is important for JavaScript that Button Style is "HTML Button".

Then create e.g. navigation bar entry for help link. See Creating a Navigation Bar Entry. Set target type to URL and URL target:

javascript:htmldbShowHelp();

You can show link conditionally if page have help. Use condition type "Exists (SQL query returns at least one row)"

SELECT 1
FROM apex_application_pages
WHERE application_id = :APP_ID
AND page_id = :APP_PAGE_ID
AND DBMS_LOB.getlength(help_text) > 0

Now you can edit your application other pages and write help to page attributes.