413
Views
16
Comments
Solved
How to keep submenu openning?
Question
Application Type
Reactive

Hi there, I have created  submenus, however it is close when i click it (for example the LOSParameters). How to make the folder MasterData stay oped when i click the submenus inside that folder and close the other folders (say it - Transaction Data folder).

Regards and thanks.

2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Indra,

I'm not facing any issue while downloading the shared .oml file from the last post. Could you try the attached one?


Kind regards,

Benjith Sam

RWA_Lab_Custom_SubMenu.oml
2022-11-03 12-53-23
Mohammad Nabil

Did you try to use the Accordion component and style the look&feel of it to match the side menu?


2025-01-09 14-56-57
IQ78

No, i just dragged the widget submenu. thanks

2021-11-08 12-36-10
Pedro Canário

Hi,

From what I read some time ago on the forum, they said outsystems would release this option (Default open or close) in a new release (I can't confirm).

I work around this problem with a if clause inside the ExtendedClass, to control when it should be open or not. You can adapt your code to know when to show open or closed



Best Regards,

Pedro C.

2025-01-09 14-56-57
IQ78

Hi, Sir, i have tried this :

and assign true to that variable IsMenuOpen:


and set the extended class:

Unfortunately, it doesn't work. What is the "open" css class?

Regards

2021-11-08 12-36-10
Pedro Canário

Hi,


The "open" css class is the class responsible for opening the sub-menu. Being always in the extendedclass should keep your sub-menu open. Can you share your .oml to see if I can help?

Best regards,

Pedro C.

2025-01-09 14-56-57
IQ78

thank you, Sir, here is the oml.

best regards

LOSUI.oml
2021-03-18 21-03-15
Benjith Sam
 
MVP

Hi Indra,

If I understood the mentioned use case correctly, are you trying to keep the collapsed submenu in the same state even though the end-user click on another sub-menu or anywhere else on the page?

If it is so, then I found a workaround to suggest using JS. 

See this demo screen: RWA | OpenSubMenuTask


Implementation Steps:

1) In the Menu block OnRender action flow, introduce a JS node

2) Define the below-mentioned JS to override the default behaviour of the submenu widget.

document.querySelectorAll('.app-menu-links .submenu.is--dropdown').forEach(function(subMenu) {
    subMenu.CloseMenu = function () { return false; };
});

I hope this helps you!


Kind regards,

Benjith Sam

RWA_Lab_Custom_SubMenu.oml
2025-01-09 14-56-57
IQ78

hi Thanks Sam,

Unfortunately it does not work.

I try to put the javas script in the existing menu:

when i click a menu item, the folder still close, not open.

regards

2021-03-18 21-03-15
Benjith Sam
 
MVP

Hi Indra,

Is the functionality presented in the demo Screen: OpenSubMenuTask is what you're trying to accomplish, or do I misunderstand your use case?


Kind regards,

Benjith Sam

2025-01-09 14-56-57
IQ78

Hi, Sam, thanks,

i meant when click the menu item, its menu folder is still open:

2021-03-18 21-03-15
Benjith Sam
 
MVP

Hi Indra,

I think I understood what you are trying to implement. I would suggest you try the below-mentioned steps.

See this demo: SubMenu Task


Implementation Steps:

1) Use the ActiveItem & ActiveSubItem input parameters

2) In every menu block instance, set the relevant ActiveItem & ActiveSubItem value

3) In the ExtendedClass property of the Submenu, set the condition expression with the 'open' & 'active' style classes

If(ActiveItem = 1,"open active","")

4) Remove the below highlighted elements

  • Deprecated client actions from the Menu block OnRender action flow 
  • The OnKeypress handler client action
  • IsMenuOpen variable that is no longer in use.

Refer to the attached .oml file

I hope this helps you!


Kind regards,

Benjith Sam

RWA_Lab_Custom_SubMenu.oml
2025-01-09 14-56-57
IQ78

Hi Sam, ta

It is a pity, the download is 0 KB.

2021-03-18 21-03-15
Benjith Sam
 
MVP
Solution

Hi Indra,

I'm not facing any issue while downloading the shared .oml file from the last post. Could you try the attached one?


Kind regards,

Benjith Sam

RWA_Lab_Custom_SubMenu.oml
UserImage.jpg
Eruel Castillo

hello can you resend the oml file? i can't download it and it is 0kb.

2023-12-11 06-11-39
Mohammad Shad

Hi Eruel,

Now try to download ( It's not my .oml ).


Thanks & Regards,

Mohammad Shad.

RWA_Lab_Custom_SubMenu (2).oml
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.