Context Menu Button in Oracle APEX 5.1

There are times when you want to add multiple buttons attributing to the same subject.

For Example: Roles in the organization. You cannot create multiple buttons for each role, rather the good option would be to have a Menu or a menu button.

In this post, I would like to share, how to create a menu button.

I have tried this in the version 5.0/5.1, below are the steps.

Step 1:  Create a button with CSS Classes as js-menuButton in the Appearance section of the Property Editor

Step 2: Add the Custom Attributes in the Advanced section of the Property Editor for the button as 

data-menu="Some_Id_menu" 

In my case, I am naming it as data-menu="Create_Employee_menu"

Step 3: Create a list in the Shared Component which you want to use in the button. It can be either Static or Dynamic as per the requirement. For the demonstration, I am going with the static list.

My list (Named as Role_List) has 3 Entries

1.  Developers
2. Testers
3. Managers

Once the creation of the List in the Shared Component is completed. 

Create a List Region in the page where you have the button with the source as the List which you created in the Shared component.

Enter the Static Id same as the prefix which you used for the Button as the data-menu attribute without _menu in Step 2

In my case, it would be Create_Employee

Step 4: Change the Behaviour of the Button to Action: Defined by Dynamic Action. You should be able to use the Context Menu button.

Step 5: Change the Template of the List Region to Menu Popup.
You can find this in the Attribute tab of the List Region -> Property Editor -> List Template

References: https://apex.oracle.com/pls/apex/apex_pm/r/520052/files/static/v56/jsdoc/menuButton.html