cancel
Showing results for 
Search instead for 
Did you mean: 

Prevent routing on sap.tnt.NavigationListItem select when minimzed?

0 Kudos

Hi,

one part of my question (prevent MainMenuItem from navigating on click) has already been answered here https://answers.sap.com/questions/39996/prevent-routing-on-saptntnavigationlistitem-select.html but I have another related issue. When the Sidenavigation is collapsed/ minimized, the MainMenuItem is visible and unfortunately clickable. Is it possible to set the visibility of that item to false when minimized or at least to remove the link?

There seems to be a mechanism that makes the MainMenuItem automatically clickable when minimized.

Thanks,

Oliver

Accepted Solutions (0)

Answers (1)

Answers (1)

0 Kudos

My guess is, that you are using nested sap.tnt.NavigationListItem and the parent one has your event handler specified. This will be inherited to the nested sap.tnt.NavigationListItem:

select="onMenuItemPressed"

In a similar case we added individual event handlers like:

<tnt:sideContent>
    <tnt:SideNavigation expanded="true" id="sideNavigation">
        <tnt:NavigationList id="sideNavigationList" items="{path: '/'}" templateShareable="true" >
            <tnt:NavigationListItem text="{text}" icon="{icon}" key="{name}" expanded="{= ${expanded} ? true : false }" hasExpander="true" select="onRootItemSelect" items="{
                        path: 'entries',
                        templateShareable: true
                    }">
                <tnt:NavigationListItem text="{name}" icon="{icon}" key="{controller}" select="onItemSelect" />
            </tnt:NavigationListItem>
        </tnt:NavigationList>
    </tnt:SideNavigation>
</tnt:sideContent>

While onItemSelect is triggering the routing, onRootItemSelect will manage the open/collapse:

/**
 * Expand/collapse root menu group, when the list item is clicked.
 * Function required as the standard behavior is to expand/collapse only in case of click on the arrow.
 * @param {object} oEvent - Event context which triggered the function.
 * @returns {void}
 */
onRootItemSelect: function(oEvent) {

    var oMenuGroup = oEvent.getSource();

    if (oMenuGroup.getExpanded()) {
        oMenuGroup.collapse();
    } else {
        oMenuGroup.expand();
    }
}

Here you could add checks if the main menu is collapsed or not and execute the expand collapse only if needed.