OAF: How to create a HTML Tab Menu in Oracle Application Framework

I have seen couple of questions in OTN Forum on how to create a HTML Tab Menu in OA Framework. So here I will explain the structure to create a Menu Structure like the one given below:

It would be better to write down the Menus and the Functions based on your requirement first. Then start to create the Function --> HTML Tab Menu --> Home Page Menu --> Standard Menu (Root Menu) --> Responsibility.

The Menu selection is highlighted using the OAHP (Home Page) and OASF (Selected Function) parameters in the Web HTML Call of the Function definition. 

The Menus and Functions defined in this example is given below.
Menu Definition
Header Syntax: User Menu Name (Menu) [Menu Type]
Line   Syntax: Seq --> Prompt --> SubMenu --> Function

 AJ Menu Root(AJ_MENU_ROOT)[Standard]  
      10 --> Home --> ---          --> AJ Function Home  
      20 --> ---  --> AJ Menu Home --> ---  
 AJ Menu Home(AJ_MENU_HOME)[Home Page]  
      10 --> ---        --> ICX_STANDARD_GLOBAL_MENU --> ---  
      20 --> ABC Header --> AJ ABC Header Menu       --> ---  
      30 --> XYZ Header --> AJ XYZ Header Menu       --> ---  
 AJ ABC Header Menu (AJ_ABC_HEADER_MENU)[HTML Tab]  
      10 --> A Line   --> ---  --> AJ A Line Function  
      20 --> B Line   --> ---  --> AJ B Line Function  
      30 --> C Line   --> ---  --> AJ C Line Function  
 AJ XYZ Header Menu (AJ_XYZ_HEADER_MENU)[HTML Tab]  
      10 --> X Line   --> ---  --> AJ X Line Function  
      20 --> Y Line   --> ---  --> AJ Y Line Function  
      30 --> Z Line   --> ---  --> AJ Z Line Function  

Function Definition
Header Syntax: User Function Name (Function)
Line   Syntax: HTML Call

 AJ A Line Function (AJ_A_LINE_FUNC)  
      OA.jsp?page=/ajtest/oracle/apps/fnd/test/webui/TestPG&OAHP=AJ_MENU_HOME&OASF=AJ_A_LINE_FUNC  
 AJ B Line Function (AJ_B_LINE_FUNC)  
      OA.jsp?page=/ajtest/oracle/apps/fnd/test/webui/TestPG&OAHP=AJ_MENU_HOME&OASF=AJ_B_LINE_FUNC  
 AJ C Line Function (AJ_C_LINE_FUNC)  
      OA.jsp?page=/ajtest/oracle/apps/fnd/test/webui/TestPG&OAHP=AJ_MENU_HOME&OASF=AJ_C_LINE_FUNC  
 AJ X Line Function (AJ_X_LINE_FUNC)  
      OA.jsp?page=/ajtest/oracle/apps/fnd/test/webui/TestPG&OAHP=AJ_MENU_HOME&OASF=AJ_X_LINE_FUNC  
 AJ Y Line Function (AJ_Y_LINE_FUNC)  
      OA.jsp?page=/ajtest/oracle/apps/fnd/test/webui/TestPG&OAHP=AJ_MENU_HOME&OASF=AJ_Y_LINE_FUNC  
 AJ Z Line Function (AJ_Z_LINE_FUNC)  
      OA.jsp?page=/ajtest/oracle/apps/fnd/test/webui/TestPG&OAHP=AJ_MENU_HOME&OASF=AJ_Z_LINE_FUNC  
 AJ Function Home(AJ_FUNCTION_HOME)  
      OA.jsp?OAFunc=AJ_A_LINE_FUNC&OAHP=AJ_MENU_HOME&OASF=AJ_FUNCTION_HOME  

Screenshot of the Responsibility/Menu/Functions below:

• Responsibility
  
• Root Menu
  
• Home Page Menu
  
• ABC Header Menu [HTML Tab]
  
  
  
• XYZ Header Menu [HTML Tab]
  
• Functions
  

Make sure you clear the cache using Functional Administrator, before you try to access the Menu. Once you run the page the outputs will be like below:

The contents of all the pages looks the same because, I have created only one PG.xml :)

Feel free to point out if anything is missing/wrong in this blog.