The menu, menubar and toolbar widgets provide various menu types.

Menu widget

The menu widget structure

• menu: the menu element, specified as:
  • element with data-widget="menu"
• menuitem: the items of the menu, specified as one of:
  • elements with role="menuitem"
  • using the data-items option, specified as a jQuery selector relative to the widget
  • the children elements of the widget

Simple menu

Multi-level menu

Tool bar widget

The toolbar widget structure

• menu: the menu element, specified as:
  • element with data-widget="toolbar"
• group: the item groups of the menu, specified as one of:
  • elements with role="group"
  • using the data-groups option, specified as a jQuery selector relative to the widget
• toolbar item: the items of the menu, specified as one of:
  • using the data-items option, specified as a jQuery selector relative to the widget
  • the children elements of the groups if any
  • the children elements of the widget

Simple toolbar example

Menu bar

The menubar widget structure

• menu: the menu element, specified as:
  • element with data-widget="menubar"
• group: the item groups of the menu, specified as one of:
  • elements with role="group"
  • using the data-groups option, specified as a jQuery selector relative to the widget
• menubar item: the items of the menu, specified as one of:
  • using the data-items option, specified as a jQuery selector relative to the widget
  • the children elements of the groups if any
  • the children elements of the widget

Simple menubar example