You need to sign in to do that
Don't have an account?
Matyas Csaba
Lightning Menu
Hello Helpers
I am workign on a lightnig component where I need menu + sub-menus
To acchieve the menu_submenu item reqquirement I used a nested <ui:menu > like in the code below
<ui:menu aura:id="TopMenu">
<ui:menuTriggerLink aura:id="Columntrigger" label="Sort Opportunities">
<lightning:icon iconName="utility:down" size="x-small"/>
Sort Opportunities
</ui:menuTriggerLink>
<ui:menuList aura:id="ColumnItem" >
<aura:iteration items="{!v.ParentSortFields}" var="col" indexVar="colindexu">
<ui:menu aura:id="InnerMenu">
<ui:menuTriggerLink aura:id="Sorttrigger" label="{!col.label}" click="{!c.TriggerLinkClick}" >
{!col.label}
</ui:menuTriggerLink>
<ui:menuList class="actionMenu" aura:id="SortDir" menuSelect="{!c.selectedmenuList}">
<ui:actionMenuItem label="Ascending" hideMenuAfterSelected="true"/>
<ui:actionMenuItem label="Descending" hideMenuAfterSelected="true" />
<ui:menuItemSeparator />
</ui:menuList>
</ui:menu>
<ui:actionMenuItem label="" />
<ui:actionMenuItem label="" />
<ui:menuItemSeparator/>
</aura:iteration>
<ui:menuItemSeparator />
</ui:menuList>
</ui:menu>
I am happy with the functonality but not happy wiht the layout
when I am opening the menu drpdown I have the below
This is more and less OK however I would d like to position the Menuitem to left or to right (if possible to not cover the data)
when I click on any menuItem it opens the submenu like below:
This is what I do not like. I would like to have my submenu items opened on the right side of the parent MenuItem
There is any option fo this?
If somebody has other suggestion to create menu wiht submenus is welcommed because my solution looks like an uggly workaround
Thanks in advance
Csbaa
I am workign on a lightnig component where I need menu + sub-menus
To acchieve the menu_submenu item reqquirement I used a nested <ui:menu > like in the code below
<ui:menu aura:id="TopMenu">
<ui:menuTriggerLink aura:id="Columntrigger" label="Sort Opportunities">
<lightning:icon iconName="utility:down" size="x-small"/>
Sort Opportunities
</ui:menuTriggerLink>
<ui:menuList aura:id="ColumnItem" >
<aura:iteration items="{!v.ParentSortFields}" var="col" indexVar="colindexu">
<ui:menu aura:id="InnerMenu">
<ui:menuTriggerLink aura:id="Sorttrigger" label="{!col.label}" click="{!c.TriggerLinkClick}" >
{!col.label}
</ui:menuTriggerLink>
<ui:menuList class="actionMenu" aura:id="SortDir" menuSelect="{!c.selectedmenuList}">
<ui:actionMenuItem label="Ascending" hideMenuAfterSelected="true"/>
<ui:actionMenuItem label="Descending" hideMenuAfterSelected="true" />
<ui:menuItemSeparator />
</ui:menuList>
</ui:menu>
<ui:actionMenuItem label="" />
<ui:actionMenuItem label="" />
<ui:menuItemSeparator/>
</aura:iteration>
<ui:menuItemSeparator />
</ui:menuList>
</ui:menu>
I am happy with the functonality but not happy wiht the layout
when I am opening the menu drpdown I have the below
This is more and less OK however I would d like to position the Menuitem to left or to right (if possible to not cover the data)
when I click on any menuItem it opens the submenu like below:
This is what I do not like. I would like to have my submenu items opened on the right side of the parent MenuItem
There is any option fo this?
If somebody has other suggestion to create menu wiht submenus is welcommed because my solution looks like an uggly workaround
Thanks in advance
Csbaa