how to check is menu open?

how to get is menu open or not?

Thanks,

Bhavani

Hi Bhavani,

Which Menu? In a Desktop app or a Mobile app?

In a Desktop app, you can look at the menu element and check for CSS classes:


Closed:

Opened:

The exact code is going to depend on what Template you're using and what environment you're in (desktop/mobile), but the logic is going to be the same: check the element with Javascript and validate if it has a class. In this case:

$('" + NameOfElement.Id + "').hasClass('open');

Afonso Carvalho wrote:

Hi Bhavani,

Which Menu? In a Desktop app or a Mobile app?

In a Desktop app, you can look at the menu element and check for CSS classes:


Closed:

Opened:

The exact code is going to depend on what Template you're using and what environment you're in (desktop/mobile), but the logic is going to be the same: check the element with Javascript and validate if it has a class. In this case:

$('" + NameOfElement.Id + "').hasClass('open');

Hi Afonso Carvalho

Thanks for your response. I need for mobile app. when the show menu base action to be trigger?

Regards,

Bhavani


Sorry, I'm not sure what you mean. In a mobile app, it's going to be similar enough. Open your mobile app on your desktop, and then check the menu element with your browser inspector. You'll be able to see a class being added whenever you open the menu: that's how its styles are toggled.

If you mean where to use this, you'd ideally encapsulate it in a Javascript element inside a screen action, and call it whenever you want to check for the Menu being open.

Can you explain to us why and when you need to check for the Menu being open? This will make it easier to help.

Afonso Carvalho wrote:

Sorry, I'm not sure what you mean. In a mobile app, it's going to be similar enough. Open your mobile app on your desktop, and then check the menu element with your browser inspector. You'll be able to see a class being added whenever you open the menu: that's how its styles are toggled.

If you mean where to use this, you'd ideally encapsulate it in a Javascript element inside a screen action, and call it whenever you want to check for the Menu being open.

Can you explain to us why and when you need to check for the Menu being open? This will make it easier to help.

Hi Afonso Carvalho,

 In the below screen shot there is a on click action to hide the menu. So when to call show menu client action for my javascript to be run.


And the reason for this is I want to develop an advanced hamburger in Outsystems as the below picture.

Thanks and Regards,

Bhavani

Hi Bhavani,

I suggest the following code. Hope it works.

1. Create a client action and create an output parameter IsOpen (Boolean)
2. Set that action as a function.
3. Add a javascript inside and set output parameter of Action (step1) from that javascript (The code is below)
4. Call that action whenever you need.

Here is output.

if (document.getElementsByClassName("menu menu--visible menu--animatable").length > 0)
{
    $parameters.IsOpen = true;
}
else
{
    $parameters.IsOpen = false;
}



With best regards,
F.Karatay

Ferhat Karatay wrote:

Hi Bhavani,

I suggest the following code. Hope it works.

1. Create a client action and create an output parameter IsOpen (Boolean)
2. Set that action as a function.
3. Add a javascript inside and set output parameter of Action (step1) from that javascript (The code is below)
4. Call that action whenever you need.

Here is output.

if (document.getElementsByClassName("menu menu--visible menu--animatable").length > 0)
{
    $parameters.IsOpen = true;
}
else
{
    $parameters.IsOpen = false;
}



With best regards,
F.Karatay

Hi Ferhat Karatay,

I have tried the same but it should call automatically when the menu is open. So, where to call that client action? it will work only when clicking on menu icon but on swiping how to call it?


Hi Bhavani,

If I understand your question, you want to call an action when an end user clicks the menu.

  1. Go to the common section
  2. Open MenuIcon web block
  3. There is an action name ShowMenu
  4. Put your action after MenuShow action.

    MenuShow action opens the menu then you can call your action.


With best regards,
F.Karatay

Solution

Hi Bhavani,

create  a swipe event in the layout block with widget Id of content.Id and create a handler for Swipe from Right Event.

Solution