Remembering current menu selection

PrimeFaces' Menu component is often used for navigation. The current menu selection helps to identify the current navigation target, which is most likely to be a web page. Menu in PrimeFaces does not remember the selected menu item in terms of visual selection. One of the requirements for the Menu component, therefore, is to display the currently clicked menu item as selected.

In this recipe, we will implement a solution for remembering the current menu selection. This will improve the menu's usability during navigation between pages.

How to do it...

Assume we have a menu with three menu items. Each menu item has URL-based navigation to a specific page. To mark a menu item as selected, we need a client-side callback bound to onclick and a styleClass with server-side binding.

<p:menu id="viewList">
  <p:menuitem value="View 1" 
  styleClass="#{naviController.getMenuitemStyleClass('page1')}"
    onclick="selectMenuitemLink(this)" ajax="false" 
    url...