Class: tabs

LuCI.ui. tabs

The tabs class handles tab menu groups used throughout the view area. It takes care of setting up tab groups, tracking their state and handling related events.

This class is automatically instantiated as part of LuCI.ui. To use it in views, use 'require ui' and refer to ui.tabs. To import it in external JavaScript, use L.require("ui").then(...) and access the tabs property of the class instance value.

new LuCI.ui.tabs()

ui.js, line 3406

Methods

initTabGroup(panes)

ui.js, line 3461

Initializes a new tab group from the given tab pane collection.

This function cycles through the given tab pane DOM nodes, extracts their tab IDs, titles and active states, renders a corresponding tab menu and prepends it to the tab panes common parent DOM node.

The tab menu labels will be set to the value of the data-tab-title attribute of each corresponding pane. The last pane with the data-tab-active attribute set to true will be selected by default.

If no pane is marked as active, the first one will be preselected.

Name Type Description
panes Array.<Node> | NodeList

A collection of tab panes to build a tab group menu for. May be a plain array of DOM nodes or a NodeList collection, such as the result of a querySelectorAll() call or the .childNodes property of a DOM node.

isEmptyPane(pane){boolean}

ui.js, line 3531

Checks whether the given tab pane node is empty.

Name Type Description
pane Node

The tab pane to check.
Returns:
Type Description
boolean Returns true if the pane is empty, else false.