# Building a context menu **URL:** \ **Category:** Ignition\ **Tags:** perspective\ **Created:** [November 2, 2022, 5:50am UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970 "2022-11-02T05:50:21Z")\ **Posts on this page:** 12\ **Page:** 1
**Author:** ![ASF](https://avatars.discourse-cdn.com/v4/letter/a/c4cdca/32.png) [@ASF](https://forum.inductiveautomation.com/u/ASF)\ **Post date:** [November 2, 2022, 5:50am UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/1 "2022-11-02T05:50:21Z")
I have a multi-zone conveyor displayed on my perspective view where a user can click to bring up a popup giving them control over that conveyor as a whole. Alternatively, they can right-click to show a context menu which allows them to select whether they want to bring up the popup for that whole conveyor, or a detail popup on the individual zone that was clicked. The context menu is working but there's a couple of fine detail things I can't seem to get working exactly how I want. How it works so far: 1. The conveyor is a flex repeater with multiple instances of "zones" 2. Each zone has an `onContextMenu` script which calls a popup. Into the popup I pass an array of strings, representing the options that I want on shown on the context menu, as well as an "identifier" parameter so that I know which zone triggered the popup 3. The popup contains a flex repeater, showing multiple instances of a label (populated by the array of strings from #2) 4. The labels embedded in the flex repeater send a message called contextMenuClick, with a payload consisting of the context menu item that was clicked, and the identifier 5. Each zone listens for the contextMenuClick message, and when it is received, compares the payload against it's own identifier to see if it needs to trigger a popup. If so, it checks the payload to determine which popup to show What doesn't work: 1. I want the context menu to look like a regular context menu in that when I hover the mouse over an item it should be highlighted. To achieve this I've added `onMouseOver` and `onMouseOut` scripts to the root container of the label view that's embedded in the flex repeater, which changes the style class of the label. It kind of works but it's not reliable - sometimes it doesn't highlight, sometimes it does but then un-highlights well before the cursor moves down to the next option. How can I fine tune this? 2. Clicking on an option in the context menu also calls `system.perspective.closePopup()` so that the context menu disappears when you click on it, just like a regular context menu. However, I'd also like the popup to close if the user clicks anywhere else on the screen, again, like a regular context menu. I can do this by making the popup modal and setting `overlayDismiss` to `True`, but making the popup modal is a bit of a hack and isn't a great user experience. Is there a way to get the popup to be background dismissible without it having to be modal? ---
**Author:** ![kgamble](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kgamble/32/8019_2.png) [@kgamble](https://forum.inductiveautomation.com/u/kgamble)\ **Post date:** [November 2, 2022, 6:24am UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/2 "2022-11-02T06:24:46Z")
Wow reading through all of this makes me really feel like there should be better native support for custom context menus. I don't know if it makes sense to need to build this entire thing from scratch all of the time. ---
**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\ **Post date:** [November 2, 2022, 9:53am UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/3 "2022-11-02T09:53:18Z")
> [@ASF](#): > > I want the context menu to look like a regular context menu in that when I hover the mouse over an item it should be highlighted. You can use styles/css for hover effects. > [@ASF](#): > > but making the popup modal is a bit of a hack and isn't a great user experience. How so? What makes this a bad user experience? ---
**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\ **Post date:** [November 2, 2022, 4:14pm UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/4 "2022-11-02T16:14:49Z")
Native context menus on all components are a feature that's actively in development. @cmallonee keeps being a good advocate for y'all and kicking the feature back 🙂 I'm not the developer, but I think y'all will be pretty happy. ---
**Author:** ![ASF](https://avatars.discourse-cdn.com/v4/letter/a/c4cdca/32.png) [@ASF](https://forum.inductiveautomation.com/u/ASF)\ **Post date:** [November 2, 2022, 10:00pm UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/5 "2022-11-02T22:00:16Z")
Of course, I didn't think of using the built in style class for hovering. I'll have a play with that! It just seems like a bad user experience because it puts that overlay over the whole screen, which is a little jarring when all you did was right click to bring up a context menu. @paul-griffith great to hear they're in development - do you have a ballpark timeline? If it's coming in the next 3-6 months I'll probably not spend too much more time trying to tweak things and just wait until it's built for me. ---
**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\ **Post date:** [November 2, 2022, 10:05pm UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/6 "2022-11-02T22:05:37Z")
I would be surprised if it takes 3 months. With the state they're currently in, 8.1.23 is _possible_; I wouldn't rely on that, but they're pretty close to the finish line. ---
**Author:** ![Matthew.gaitan](https://avatars.discourse-cdn.com/v4/letter/m/59ef9b/32.png) [@Matthew.gaitan](https://forum.inductiveautomation.com/u/Matthew.gaitan)\ **Post date:** [November 2, 2022, 11:15pm UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/7 "2022-11-02T23:15:27Z")
> [@paul-griffith](#): > > Native context menus on all components are a feature that's actively in development. 🤤 This is great to hear! This is one of the things I _reaaaalllllly_ missed from vision. Building a popup for context menus is a PITA ---
**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\ **Post date:** [November 3, 2022, 10:54am UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/8 "2022-11-03T10:54:48Z")
> [@ASF](#): > > It just seems like a bad user experience because it puts that overlay over the whole screen, which is a little jarring when all you did was right click to bring up a context menu. You could try some css trickery to make the overlay invisible, would that solve the issue for you ? ---
**Author:** ![ASF](https://avatars.discourse-cdn.com/v4/letter/a/c4cdca/32.png) [@ASF](https://forum.inductiveautomation.com/u/ASF)\ **Post date:** [November 3, 2022, 10:24pm UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/9 "2022-11-03T22:24:57Z")
It would, but given the indication that we'll have it built in natively in a few months, I'm happy to deal with it until then. Thanks though! ---
**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\ **Post date:** [November 3, 2022, 11:41pm UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/10 "2022-11-03T23:41:15Z")
> [@paul-griffith](#): > > With the state they're currently in, 8.1.23 is _possible_; Hey Paul, there isn't a public place showing what's currently in active development, is there? It'd be cool to know what cool new things we might expect to see in coming versions, but I can understand why this might also not be made public until release as well ---
**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\ **Post date:** [November 4, 2022, 12:02am UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/11 "2022-11-04T00:02:09Z")
We've talked in the past about a public mirror or something of our internal bug tracker, but there's not a lot of push for it internally relative to other things, so it hasn't really gone anywhere. ---
**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\ **Post date:** [January 19, 2023, 12:10am UTC](https://forum.inductiveautomation.com/t/building-a-context-menu/65970/12 "2023-01-19T00:10:28Z")
> [@New Feature: Component Context Menu](https://forum.inductiveautomation.com/t/new-feature-component-context-menu/68763): > > We've introduced a new concept to Perspective Components: a first-party context menu. This context menu is configured within the props of each component, within meta.contextMenu. Each component's context menu is disabled by default, and may be enabled by setting the meta.contextMenu.enabled property. Each item (aside from Separator) also allows for configuring an icon to be displayed. There are five types of items supported as of today: Link Message Method Separator Submenu Link: Allows fo…