UIZE JavaScript Framework

JAVASCRIPT EXAMPLES Tree Menu From JSON

In this example, an instance of Uize.Widgets.NavTree.Menu.Widget is instantiated to produce a multi-level menu. The markup for the menu is generated when the widget is wired up. The structure for the markup is driven by a JSON data structure that is supplied to the items state property of the widget. This data structure is purely for demonstration purposes, so none of the items have active links specified (i.e. clicking does nothing). The generated markup does not contain any styling, and the decoration for the menu is controlled by separate CSS in the page. As you interact with the menu, notice how the selection path is highlighted as you go deeper into submenus. Lower down the page, below the menu, are some links that execute snippets of code to demonstrate the programmatic interface of the widget.