Can you assign an additional function to a button to collapse a side menu?

1
I am wondering if there is a way to collapse the side menu by clicking a button outside the side menu. As on now my app is requiring me to click on the hamburger again in order to collapse the side menu. I feel my app would flow better if clicking any button that is outside of the side menu would result in the side menu collapsing.  
asked
1 answers
1

I dont have the exact solution but you can go about like this.

what i noticed is, the side menu is nothing but a scroll container (effectively a div html tag) with a data-mendix-id property set to a large value. In my application (which is a blank mendix app) it is data-mendix-id="64.Atlas_Core.Atlas_Default.layoutContainer$DanielSan"

When the menu bar is clicked there is DOM manipulation happening which simply adds and removes 1 class that is : mx-scrollcontainer-open

So by doing a simply DOM manipulation you can achieve the menu close and open functionality

 

// to open the menu
document.querySelectorAll('[data-mendix-id="64.Atlas_Core.Atlas_Default.layoutContainer$DanielSan"]')[0].classList.add("mx-scrollcontainer-open")

// to close the menu
document.querySelectorAll('[data-mendix-id="64.Atlas_Core.Atlas_Default.layoutContainer$DanielSan"]')[0].classList.add("mx-scrollcontainer-open")

So you can see where this is going, options are you do a simple custom widget or a pluggable widget or a Javascript action which simply does the DOM manipulation.

Hope i put you in sort of the right path. Good luck

answered