167
Views
12
Comments
Reactive - Keep submenu open after selection
Question

I have a menu that contains a Submenu. This is implement as shown below;


Whenever I open the submenu and click on one of it's items the page opens but the submenu closes. I rather want it to stay open. 

Note that having it open by default is no issue, that's simply by adding the css class "open" to the ExtendedClass parameter. And I could of course create a whole elaborate mess of client actions and local variables to detect if I need to add the "open" class to the submenu but I was wondering if there is a nicer and cleaner method for this? 

Demo: https://vkoning.outsystemscloud.com/LeafletJSReactiveDemo/EventsToggleEvents
Download: https://www.outsystems.com/forge/component-overview/6907/leafletjs-reactive

note: No, this is not an advertorial in disguise. I really want to have a nice and clean solution for this problem and this application has and easy to share behavior of my issue.

Champion
Rank: #87

I also noticed that by adding the css class "open" to the submenu you get a ugly flicker when you perform a page transition. 

Rank: #9504

Vincent Koning wrote:

I also noticed that by adding the css class "open" to the submenu you get a ugly flicker when you perform a page transition. 

Hello
I was struggling with the same issue in a reactive app - while using the submenu component - and I just figured out a solution.

You can create a CSS like below:

SyntaxEditor Code Snippet

.layout-side .submenu.active .submenu-items {
    display: flex;
}
Champion
Rank: #87

Hi Claiton, 

I'll test this out and see if it works. I also created a support ticket for this but the answer was something along the lines of "live with it" so that was not really helpful. 

Champion
Rank: #102

Hi guys!


I'm having the same issue with a lot of customers complaining they want the menus to be open.

Currently, there's no easy way to do this, but cloning the SetActiveMenuItems action, I can do a workaround for making the menu opened by default.

This is not pretty, but works and is a simple solution.


But the problem is not solved, because there's this listener on the LayoutReady action, that closes the menu whenever I click outside...


Can you please make a parameter so I'm able to decide if I want to keep the menu opened or closed?


I have already 10 costumers complaining about this, and this could save probably a lot more costumers..


Cheers!

Champion
Rank: #102

Just to add a bit more of insights. Actually, this could make sense on LayoutTop, but not on LayoutSideMenu.


If you think the parameter is not an option, you could at least verify the layout being used on the screen. Although in my projects, sometimes I have custom layouts, so the parameter is always welcome that will give us more freedom of choice.


Hope this can be looked into in the next version of OutSystems UI! :)


Cheers!

Champion
Rank: #87

I have created an Idea for this to get it a bit more traction. https://www.outsystems.com/ideas/9431/reactive-keep-submenu-open-after-selection

@Alexandre: Please post you use-case also in this idea please!

Champion
Rank: #102

Ok, will do :)

Staff
Rank: #2169

Hi Vincent Koning,


Thanks for the report!

We will be looking into this, particularly for the Layout Side Menu.


Best regards,

Bernardo Cardoso

Champion
Rank: #87

Hi Bernardo,

Thanks for the confirmation. I also found a strange behavior bug regarding the Floating Actions. What is the best way to report these? Via the Forum, Ideas of Support?

Greetings,

Vincent

Staff
Rank: #2169

Hi Vincent Koning,


I would the OutSystems UI page on the Forge, under Support tab, is the best place. That being said, you can share that here if you want!


Best regards,

Bernardo Cardoso

 

Hello guys,

I work around this problem with a if clause inside the extendedClass..

As in the traditional web development you could control the ActiveItem input with an static entity.

I hope it helps you.

Champion
Rank: #102

Hi Guilherme,


The issue was solved by OutSystems in a new release, somewhere between September and October I think.

Although that would not solve the issue that I was reporting, but thanks for your time anyway. :)


Cheers!