Table of Contents

Creating a menu

Terminology

When building a cluster application, a menu can be created to provide entry points for the application views.

The application menu is composed of Menus metadata, which are themselves composed of Menu details referencing Menu items.

Note

Each Menu (and its Menu details) is associated with a module but can reference Menu items from various modules.

Creating a new menu item

A menu item represents a clickable element of the menu. For the moment it can only describe the action of opening a UI view.

However, the Caption property is the text which will be displayed by the element.

To create a new menu item, deploy the desired module node, then the Frontend node and click on the + button next to the Menu items item to create a new menu item.

Action type

The action type defines what the menu item will do when clicked on. 3 modes are available:

  • None : The menu item does no action. Useful for a parent menu item that contains other menu items.
  • Open View : Opens the associated UI view in a new frame.
  • Code : Executes C# code.

Here is an example of where the OrderEditUI UI view is opened by C# code.

NavigationOptions navigationOptions = new NavigationOptions("OrderEditUI")
    .OnTarget(NavigationTarget.Popup) // Opens the UI view in a popup
    .WithPopupSize(PopupSize.Full); // Sets the popup size
NavigateAsync(navigationOptions);
Warning

Don't forget to click on the save button to be able to add your menu item in a menu.

Creating a new menu

To create a new menu, deploy the desired module node, then the Frontend node and click on the + button next to the Menus item to create a new menu.

Note

In the current version of Neos, menu implementation only allows to build menu with one depth level. In the future version, it will be possible to create a hierarchical menu of several levels of depth.

General properties

  • The Caption property is the text which will be displayed.
  • The Position property is the position of the menu in relation to others
Warning

Be careful that this position is relative to every menus of the cluster. It means that it should not be the same between menus of different modules.

  • If Enabled property is set to false, the menu and all its details will not be displayed.

To add a menu detail to the menu, click on the + button of the Details section.

Menu details of a menu will be sorted according to the Position property of each menu detail.

The displayed text depends of the associated Menu item property.

Updating the application

After all the configuration is done, save the menu and click on the Generate application button to update the application menu.

You can then refresh the application web page to see your newly created menu.