Hide options menu if open and click outside menu
I 'm working on the todo tut and trying to add a feature where you have an options menu on each list item which contains options to "delete " or "duplicate " a given task item . I 'm using a variable called "show " to store a boolean value which dictates to hide /show the menu and have it working just fine when you click the ... , however I 'm a bit confused as to how to set up a formula to close the menu when clicking outside the element . I 'm practicing setting this "options menu " as a component so I could use it for any list items that might have options menus in the app . My thought was to bind a click event to a parent div (shown in image ) and use a formula to check if the "show " variable was presently set to "true " and if so , set it to "false " but this doesn 't seem to be working as I expected . This will change the variable to the opposite without having to worry about If statements and the menu is open the gif is not an actual toddle app just an example of how i would like it to function That makes a lot more sense lol Does that make sense ? The 'old -school ' method of creating modals and similar I just meant it has been used for a long time as it is very simple to set up i found blog post You could use that or just clone the dropdown component , either way it would be a good start or i guess more "correct " approach ? Solved a lot of annoyances with building modals and dropdowns It is still not entirely complete as it isn 't simple to position the element for now , at least not until Anchor ( ) CSS changes happen or similar You can always bring in custom actions But people always tend to favor 'native ' toddle solutions so I tend not to mention them as much
.jpeg/public)