CODEWITHSUNDEEP
apexoracle-apex-5oracle-apex-5.1
KJS1192
KJS1192

Reputation: 103

Oracle APEX side navigation menu - expanding sub navigation menu items

I have a nav menu item (Nav Item 1) that has three sub items under it. No page is directly tied to Nav Item 1. To expand it, you must click the down carat. However, is there a way to make it so that the user can just click anywhere on the entire nav menu button rather then clicking the carat only? See below:

Nav Item 1
   Sub item 1 
   Sub item 2 
   Sub item 3

Does anybody know how to do this?

Upvotes: 1

Views: 2004

Answers (1)

Salim Hlayel
Salim Hlayel

Reputation: 371

Max has provided a solution in this blog post: https://askmax.blog/2016/01/27/accordion-like-navigation-menu/

Basically you need to invoke the click() function by clicking the top List Item using little JavaScript code.

Quoting Max Answer:

Use this one if you set your target type to URL and your URL target to #

$('#t_Body_nav #t_TreeNav li.a-TreeView-node--topLevel > div.a-TreeView-content:has(a[href="#"])').click(function(){
    $(this).prev('span.a-TreeView-toggle').click();
});

Use this one if you set your target type to - No Target -

$('#t_Body_nav #t_TreeNav li.a-TreeView-node--topLevel > div.a-TreeView-content:not(:has(a))').click(function(){
    $(this).prev('span.a-TreeView-toggle').click();
});

Upvotes: 2

Related Questions