Service Portal 'Cart' menu item display

Katie A
Mega Guru

Hello, I am building a custom application in the Service Portal using pages and widgets.

The main menu must only show certain items based on the logged in user's role.

I was able to set the 'condition' on *most* of the main menu items by going to:

Service Portal > Menus > Service Portal Header Menu

Open menu item > Set 'condition' to gs.hasRole("examplerole")

However, I need to change the 'condition' on the 'Cart' menu item. The 'Cart' menu item is not available in the Menu Items list.

Where are the conditions to display the 'Cart' menu item as shown in the screenshot below?

Thanks!

Cart Menu item I want to set the conditions on:

find_real_file.png

Cart menu item does not show up in Service Portal Header Menu item records list:

find_real_file.png

 

1 REPLY 1

Jace Benson
Mega Sage

OOB there are no conditions, just either that it is or is not visible;

https://docs.servicenow.com/bundle/kingston-servicenow-platform/page/build/service-portal/concept/enable-shopping-cart.html

You can look at the Header Menu widget HTML which goes over what it does to show it.  It's likely you'll have to add your logic there in a custom menu.

Here's the html I see in my instance for it.  You might be able to change the actual cart widget, but I don't think that will help you for what you want.

<ul class="nav navbar-nav" aria-label="${Header menu}">
  <div class="header-loader" ng-show="loadingIndicator">
    <div class="hidden-xs sp-loading-indicator la-sm">
      <div></div>
      <div></div>
      <div></div>
    </div>
  </div>
  <li ng-repeat="item in visibleItems" ng-class="{dropdown: item.items.length > 0, 'header-menu-item': true}" ng-include="'menuTemplate'"></li>
  <!-- Shopping cart stuff -->
 <li ng-if="options.enable_cart && data.isLoggedIn" ng-show="!accessibilityEnabled" class="dropdown hidden-xs header-menu-item">
  	<a href="javascript:void(0)"
       data-toggle="dropdown"
       id="cart-dropdown"
       uib-tooltip-template="'item-added-tooltip.html'"
       tooltip-placement="bottom"
       tooltip-trigger="'none'"
       tooltip-is-open="$parent.itemAddedTooltipOpen"
       title="${Your shopping cart currently has} {{cartItemCount}} ${items}"
       aria-label="${Shopping cart}">
    	<i class="fa fa-shopping-cart" aria-hidden="true"></i>
      <span ng-bind-html="'${Cart}'" aria-hidden="true"></span>
      <span ng-if="cartItemCount > 0" aria-hidden="true" class="label label-as-badge label-primary sp-navbar-badge-count">{{cartItemCount}}</span>
		</a>
    <div class="dropdown-menu cart-dropdown">
      <sp-widget widget="data.cartWidget"></sp-widget>
    </div>
  </li>
  <li ng-if="options.enable_cart && data.isLoggedIn" class="dropdown" ng-class="{'visible-xs': !accessibilityEnabled}"  aria-label="${Your shopping cart currently has} {{cartItemCount}} ${items}">
  	<a href="?id=sc_cart"
       title="${Cart}"
       class="toggle-dropdown">
    	<i class="fa fa-shopping-cart\" aria-hidden="true"></i>
      <span ng-bind-html="'${Cart}'" aria-hidden="true"></span>
      <span ng-if="cartItemCount > 0" aria-hidden="true" class="label label-as-badge label-primary sp-navbar-badge-count">{{cartItemCount}}</span>
	</a>
  </li>
</ul>