# Perspective: 2-tiered menu with Horizontal Menu component?

**URL:** <https://forum.inductiveautomation.com/t/perspective-2-tiered-menu-with-horizontal-menu-component/40122>\
**Category:** Ignition\
**Tags:** ignition80\
**Created:** [October 29, 2020, 2:07am UTC](https://forum.inductiveautomation.com/t/perspective-2-tiered-menu-with-horizontal-menu-component/40122 "2020-10-29T02:07:46Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**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:** [October 29, 2020, 2:07am UTC](https://forum.inductiveautomation.com/t/perspective-2-tiered-menu-with-horizontal-menu-component/40122/1 "2020-10-29T02:07:46Z")

</div>

Not sure if i’m missing something obvious, but how would I create a 2-tiered navigation using the Horizontal Menu component?  
I.e. the 1st tier shouldn’t navigate, it will just set a custom property value to say which tab was clicked. The 2nd tier will be made up of multiple horz menus for each tab in the 1st tier and _will_ navigate to the tab clicked.  
I’m not seeing a way to get the selected item 🤔

---

<div class="post-metadata">

**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:** [October 29, 2020, 2:15am UTC](https://forum.inductiveautomation.com/t/perspective-2-tiered-menu-with-horizontal-menu-component/40122/2 "2020-10-29T02:15:26Z")

</div>

Nevermind… it’s one of those days apparently.  
Under event scripts Component Events `onItemClicked` does all I need.

---

<div class="post-metadata">

**Author:** ![dustin.cooper](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/dustin.cooper/32/29963_2.png) [@dustin.cooper](https://forum.inductiveautomation.com/u/dustin.cooper)\
**Post date:** [October 20, 2021, 7:15pm UTC](https://forum.inductiveautomation.com/t/perspective-2-tiered-menu-with-horizontal-menu-component/40122/3 "2021-10-20T19:15:44Z")

</div>

Maybe one of those days for me too, but do you mind sharing how you did this @nminchin ?

> I.e. the 1st tier shouldn’t navigate, it will just set a custom property value to say which tab was clicked

The only way I've found to be able to set a custom prop rather than navigating is to disable the item, and then use the `onItemClicked` method to use the `event.target` to set the custom prop. It works but the disabled icon over the menu component is confusing for the user.

---

<div class="post-metadata">

**Author:** ![richardNZ15](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/richardnz15/32/33373_2.png) [@richardNZ15](https://forum.inductiveautomation.com/u/richardNZ15)\
**Post date:** [March 27, 2022, 9:08pm UTC](https://forum.inductiveautomation.com/t/perspective-2-tiered-menu-with-horizontal-menu-component/40122/4 "2022-03-27T21:08:58Z")

</div>

Also interested in this if either of you managed to get it working without disabling the button.  
I’d love to use this component for setting custom session properties, and navigate to a view instead of a page, but i’m struggling a bit with it.

---

<div class="post-metadata">

**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:** [March 27, 2022, 9:18pm UTC](https://forum.inductiveautomation.com/t/perspective-2-tiered-menu-with-horizontal-menu-component/40122/5 "2022-03-27T21:18:52Z")

</div>

Sorry it’s been… A while…  
You just don’t set the target of the 1st tier tabs and use the onItemClicked event to write to a custom prop to store the selected tab. Then you use that prop to display the right 2nd tier menu which has all of your tabs with targets
