Mendix 7 is no longer supported unless you have Extended Support (for details, please contact Mendix Support). Mendix 7 documentation will remain available for customers with Extended Support until July, 2024.
Navigation Tree
The navigation tree widget shows a configured menu in the form of a tree. Items can have subitems in which case the main item can be expanded. The menu structure of the navigation tree can have three levels. In the end a Menu Item points to either the page or the microflow that will opened or started when the item is clicked.
Common Properties
Name
The internal name of the widget. You can use this to give sensible names to widgets. The name property also appears in the generated HTML: the widget DOM element automatically includes the class mx-name-{NAME}
, which can be useful for Selenium testing.
Class
The class property allows you to specify one or more cascading style sheet (CSS) classes for the widget. The classes should be separated by a space. The classes will be applied to the widget in the browser and the widget will get the corresponding styling. The classes should be classes in the theme that is used in the project. It overrules the default styling of the widget.
Styling is applied in the following order:
- the default styling defined by the theme the project uses
- the
Class
property of the widget - the
Style
property of the widget.
You can see which widgets in a page have styling applied via the class or style property by clicking the Show styles button.
Style
The style property allows you to specify additional CSS styling. If a class is also specified, this styling is applied after the class.
For example:
background-color:lightblue; color:red;
will result in red text on a blue background.
You can see which widgets in a page have styling applied via the style or class property by clicking the Show styles button.
General Properties
Menu source
The items that are shown in the menu widget are determined by the menu source. A menu widget is either filled from a menu configured in the Navigation document or a Menu document.
Value | Description |
---|---|
Project Navigation | The menu items are taken from one of the menus defined in the Navigation document. Use this for the main menu of your application. |
Menu Document | The menu items are taken from a Menu document. Use menu documents for auxiliary menus. |
Default value: Project navigation
Menu (only for menu source ‘Project navigation’)
If the menu source is ‘Project navigation’, this property specify which of the three menus that can be configured in the Navigation document will be used to fill the menu widget.
Value | Description |
---|---|
Desktop | Use the ‘Desktop’ menu |
Tablet | Use the ‘Tablet’ menu |
Phone | Use the ‘Phone’ menu |
Default value: Desktop
Menu document (only for menu source ‘Menu document’)
If the menu source is ‘Menu document’, you can select a Menu document that will be used to fill the menu widget.