Creating a Menu Popup in Oracle APEX Using Custom Attributes

-

Step-by-Step: Creating a Menu Popup in Oracle APEX Using Custom Attributes



Follow these steps to create a popup menu that appears when a button is clicked.

Step 1: Create a List in Shared Components

  1. Go to App Builder → Shared Components → Lists

  2. Click Create

  3. Add your menu items (e.g., Home, Reports, Settings, Logout)

  4. Save the list

This list will be the source of your popup menu.


 

Step 2: Add a Button and List to a Page

  1. Open the page where you want the popup menu

  2. Add a Button (e.g., label it Menu)

  3. Add a List Region (region type = List)

  4. Link the List region to the list you created in Step 1

The list items will be displayed when the button is clicked.


 

Step 3: Assign a Static ID to the List

  1. Select the List Region in the Page Designer

  2. Go to Advanced → Static ID

  3. Enter a name, for example:

    cust

The Static ID will be used to target this list in your popup.

Step 4: Add a Custom Attribute to the Button

  1. Select the button you created

  2. Go to Advanced → Custom Attributes

  3. Add the following attribute:

    data-menu="cust_menu"

This links the button to the menu list. The data-menu attribute will be used by APEX to show the popup when clicked.

    4. Change the behavior of the button to Defined by Dynamic Action


  

 

 

Step 5: Save and Run

  1. Save your changes

  2. Run the page

Your popup navigation menu is now ready and will appear when the button is clicked.


Comments

Post a Comment

Popular posts from this blog

Stripe Payment Gateway in Oracle APEX

-
Image
  Step-by-Step Guide: Stripe Payment Gateway in Oracle APEX Step 1: Create a Stripe Developer Account First, create a Stripe developer account using the official Stripe documentation link: 👉  https://docs.stripe.com/development After signing up, log in to the  Stripe Dashboard . Step 2: Get Stripe API Keys From the Stripe Dashboard: Navigate to  Developers → API Keys Copy: Publishable Key Secret Key ⚠️ Important: Keep the  Secret Key confidential . Never expose it on the client side. Step 3: Create a Blank Page in Oracle APEX Create a  Blank Page  in your Oracle APEX application Add the following page items: Text Field  – to enter the payment amount (e.g.,  P20_AMOUNT ) Button  – to submit the payment (e.g.,  Submit )                                                    Step 4: Create a...
Read more

Creating a Functional Button in an Oracle APEX Interactive Grid

-
Image
  Let’s Create a Button That Doubles the Salary of the Selected Employee Step 1: Create an Interactive Grid Create a Blank Page Add an Interactive Grid region using your employee table or query Step 2: Set Static IDs Assign a Static ID to the Interactive Grid Assign a Static ID to the column on which the operation will be performed (for example, the SAL  column) These Static IDs will be used in JavaScript. Step 3: Add JavaScript Code Paste your JavaScript code into the Initialization JavaScript Function section of the Interactive Grid attributes. function (options)  { var  $ =  apex.jQuery ;   var  toolbarData  = $. apex.interactiveGrid.copyDefaultToolbar (),       toolbarGroup  =  toolbarData.toolbarFind ("actions3");     /* Add custom button */   toolbarGroup.controls.push({      type: "BUTTON",      action: "double-salary",      label: "...
Read more