1.Overview
In Oracle APEX quick menu navigation is essential for creating a user-friendly and efficient application. Implement a quick search functionality to allow users to find specific pages or records quickly. This is especially useful in applications with a large number of pages. For example, clicking on a menu item triggers a dynamic action to navigate to the corresponding page.
2.Technologies and Tools Used
The following technologies has been used to achieve the same.
- Oracle APEX
- PL/SQL
- JavaScript
3.Use Case
- An application which has complex menu structure with multiple levels of navigation can be better suitable for this approach that allowing users to quickly find the menu’s.
- This feature saves time and improves the overall efficiency of user.
- Implementing quick navigation search will significantly improve user satisfaction and productivity by providing a quick and efficient way to locate and access relevant page.
4.Architecture
Step1: Create One Static Region with Following Properties
Position – After Logo
Template – Blank With Attributes
Step2: Create Text field with auto complete Page item with the name of P0_MENU_SEARCH.
Step3: Set List of Values as SQL Query and Paste the Following Query
SELECT distinct ENTRY_TEXT
FROM APEX_APPLICATION_LIST_ENTRIES A,APEX_APPLICATION_PAGES B
WHERE 1=1
AND A.APPLICATION_ID=B.APPLICATION_ID
AND A.APPLICATION_ID=:APP_ID
AND TRIM((regexp_replace(A.ENTRY_TARGET, ‘[^0-9]’, ”)))=B.PAGE_ID
AND A.LIST_NAME=’Navigation Menu’
and b.PAGE_MODE=’Normal’
ORDER BY 1 ASC;
Step4: Additionally create two page items (P0_REDIRECT_NAME & P0_REDIRECT_URL
) with hidden type.(Value Protected should be off)
Step5 : Create dynamic action with the following details
Name : Navigation Value
Event : Key Release
Selection Type : item(s)
Items : P0_MENU_SEARCH
Client Side Condition : this.browserEvent.keyCode===13 (java script Expression)
Step6: Create one True action with the following details
Action : Set Value
Set Type : SQL Statement
Items to submit : P0_MENU_SEARCH
Affected Elements : P0_REDIRECT_NAME,P0_REDIRECT_URL
Step7: Paste the following SQL query into SQL Statement area.
SELECT
DISPLAY,
(APEX_UTIL.PREPARE_URL( p_url => RET_URL,
p_checksum_type => ‘SESSION’) )
AS RET_URL
FROM
(SELECT ‘BRANCH’ AS DISPLAY,
replace(REPLACE(REPLACE(REPLACE(ENTRY_TARGET,’&’,”),’APP_ID.’
,:APP_ID),’APP_SESSION.’,:APP_SESSION),’SESSION.’,
:APP_SESSION ) AS RET_URL
FROM APEX_APPLICATION_LIST_ENTRIES
WHERE APPLICATION_ID=:APP_ID
AND LIST_NAME=’Desktop Navigation Menu’
AND UPPER(ENTRY_TEXT) =UPPER(:P0_MENU_SEARCH)
ORDER BY 1 ASC)
Step8: Create second true action (Execute Java Script code) with the following code
var a = apex.item( “P0_REDIRECT_NAME” ).getValue();
var b = apex.item( “P0_REDIRECT_URL” ).getValue();
b = b.replaceAll(///g,”/”);
b = b.replaceAll(/&/g,”&”);
if ( ( a === “BRANCH”) && ( ( a!== “undefined” || a !== null ) && ( b!== “undefined” || b !== null ) ) )
{
javascript:window.open(”+ b + ”, ‘_self’);
$x(“P0_MENU_SEARCH”).value =”;
}
Step9: Create Same Dynamic action code for ‘Change’ Event Also.
Step10: Save the Application and Run
Conclusion:
In conclusion, implementing search navigation in platforms like Oracle APEX, offers several advantages that contribute to an enhanced user experience, improved efficiency, and streamlined access to information.
Screenshots:
With Hidden page items: