Internal_cellExpose some useful methods of the util.ts module as tree._util.
InternalactiveUse setColumn()/getActiveColElem() to access.
OptionalcheckboxShow/hide a checkbox or radiobutton.
List of column definitions.
ReadonlydataContains additional data that was sent as response to an Ajax source load request.
ReadonlyelementThe div container element that was passed to the constructor.
Filter options (used as defaults for calls to Wunderbaum.filterNodes )
ReadonlyheaderThe div.wb-header element if any.
OptionaliconShow/hide a node icon.
OptionaliconShow/hide a tooltip for the node icon.
ReadonlyidUnique tree ID as passed to constructor. Defaults to "wb_SEQUENCE".
InternallastInternallastReadonlylistThe div.wb-list-container element that contains the nodeListElement.
ReadonlynodeThe div.wb-node-list element that contains all visible div.wb-row child elements.
Merged options from constructor args and tree- and extension defaults.
ReadonlyreadyA Promise that is resolved when the tree was initialized (similar to init(e) event).
ReadonlyrootThe invisible root node, that holds all visible top level nodes.
OptionaltooltipShow/hide a tooltip.
Shared properties, referenced by node.type.
OptionalunselectableDefine a node checkbox as readonly.
StaticutilExpose some useful methods of the util.ts module as Wunderbaum.util.
StaticversionWunderbaum release version number "MAJOR.MINOR.PATCH".
Currently active node if any. Use setActive to modify.
Current node hat has keyboard focus if any. Use setFocus() to modify.
Return the icon-function -> icon-definition mapping.
Call event handler if defined in tree or tree.EXTENSION options.
Example:
tree._callEvent("edit.beforeEdit", {foo: 42})
Optionalextra: anyCall tree method or extension method if defined.
Example:
tree._callMethod("edit.startEdit", "arg1", "arg2")
Internalsanity check.
Update column headers and column width. Return true if at least one column width changed.
Iterate all descendant nodes depth-first, pre-order using for ... of ... syntax.
More concise, but slightly slower than Wunderbaum.visit.
Example:
for(const node of tree) {
...
}
Append (or insert) a list of toplevel nodes.
Optionaloptions: AddChildrenOptionsApply a modification (or navigation) operation on the tree or active node.
Optionaloptions: ApplyCommandOptionsApply a modification (or navigation) operation on a node.
Optionaloptions: ApplyCommandOptionsDelete all nodes.
Reset the filter.
Return the number of nodes in the data model.
if true, nodes that are hidden due to collapsed parents are ignored.
Return the number of nodes that match the current filter.
Clear nodes and markup and detach events and observers.
This method may be useful to free up resources before re-creating a tree on an existing div, for example in unittest suites. Note that this Wunderbaum instance becomes unusable afterwards.
Disable render requests during operations that would trigger many updates.
try {
tree.enableUpdate(false);
// ... (long running operation that would trigger many updates)
foo();
// ... NOTE: make sure that async operations have finished, e.g.
await foo();
} finally {
tree.enableUpdate(true);
}
Recursively expand all expandable nodes (triggers lazy load if needed).
Optionaloptions: ExpandAllOptionsDim or hide whole branches.
Use filterNodes instead and set options.matchBranch: true.
Dim or hide unmatched nodes.
a string to match against node titles, or a callback function.
filter options. Defaults to the tree.options.filter settings.
the number of nodes that match the filter.
Find all nodes that match condition.
title string to search for, or a
callback function that returns true if a node is matched.
Find all nodes with a given refKey (aka a list of clones).
a node.refKey value to search for.
an array of matching nodes with at least two element or []
if nothing found.
Find first node that matches condition.
title string to search for, or a
callback function that returns true if a node is matched.
Find the next visible node that starts with match, starting at startNode
and wrap-around at the end.
Used by quicksearch and keyboard navigation.
OptionalstartNode: null | WunderbaumNodeFind a node relative to another node.
'down', 'first', 'last', 'left', 'parent', 'right', or 'up'.
(Alternatively the keyCode that would normally trigger this move,
e.g. $.ui.keyCode.LEFT = 'left'.
Not yet implemented
Return multiline string representation of the node hierarchy. Mostly useful for debugging.
Example:
console.info(tree.format((n)=>n.title));
logs
Playground
├─ Books
| ├─ Art of War
| ╰─ Don Quixote
├─ Music
...
Optionalname_cb: NodeStringCallbackOptionalconnectors: string[]Iterator version of Wunderbaum.format.
Optionalname_cb: NodeStringCallbackOptionalconnectors: string[]Return the active cell (span.wb-col) of the currently active node or null.
Return the currently active node or null (alias for tree.activeNode).
Alias for Wunderbaum.activeNode.
Return the first top level node if any (not the invisible root node).
Return the node that currently has keyboard focus or null. Alias for Wunderbaum.focusNode.
Return the lowest visible node in the viewport.
Return tree.option.NAME (also resolving if this is a callback).
See also WunderbaumNode.getOption()
to evaluate node.NAME setting and tree.types[node.type].NAME.
option name (use dot notation to access extension option, e.g.
filter.mode)
OptionaldefaultValue: anyReturn an array of selected nodes.
only return the topmost selected node (useful with selectMode 'hier')
Return the topmost visible node in the viewport.
Return true if the tree (or one of its nodes) has the input focus.
Return true if the tree displays a header. Grids have a header unless the
header option is set to false. Plain trees have a header if the header
option is a string or true.
Return true if cell-navigation mode is active.
Return true if any node title or grid cell is currently beeing edited.
See also Wunderbaum.isEditingTitle.
Return true if any node is currently in edit-title mode.
See also WunderbaumNode.isEditingTitle and Wunderbaum.isEditing.
Return false if tree is disabled.
Return true if a filter is currently applied.
Return true if tree has more than one column, i.e. has additional data columns.
Return true if any node is currently beeing loaded, i.e. a Ajax request is pending.
Return true if row-navigation mode is active.
Reload the tree with a new source.
Previous data is cleared. Note that also column- and type defintions may
be passed with the source object.
Write to console.log with tree name as prefix if opts.debugLevel >= 4.
Write to console.debug with tree name as prefix if opts.debugLevel >= 4.
and browser console level includes debug/verbose messages.
Write to console.error with tree name as prefix.
Write to console.info with tree name as prefix if opts.debugLevel >= 3.
InternalInternalWrite to console.warn with tree name as prefix with if opts.debugLevel >= 2.
Run code, but defer rendering of viewport until done.
tree.runWithDeferredUpdate(() => {
return someFuncThatWouldUpdateManyNodes();
});
Make sure that this node is vertically scrolled into the viewport.
Nodes that are above the visible area become the top row, nodes that are below the viewport become the bottom row.
Set or remove keyboard focus to the tree container.
Optionaloptions: SetActiveOptionsSet the tree's navigation mode.
Set column #colIdx to 'active'.
This higlights the column header and -cells by adding the wb-active
class to all grid cells of the active column.
Available in cell-nav mode only.
If options.edit is true, the embedded input element is focused, or if colIdx is 0, the node title is put into edit mode.
Optionaloptions: SetColumnOptionsDisable mouse and keyboard interaction (return prev. state).
Set or remove keyboard focus to the tree container.
Set the tree's navigation mode option.
Set tree option. Use dot notation to set plugin option, e.g. "filter.mode".
Display tree status (ok, loading, error, noData) using styles and a dummy root node.
Optionaloptions: SetStatusOptionsAdd or redefine node type definitions.
Convenience method to implement column sorting.
Sort nodes list by title or custom criteria.
custom compare function(a, b) that returns -1, 0, or 1 (defaults to sorting by title).
pass true to sort all descendant nodes recursively
Convert tree to an array of plain objects.
Optionalcallback: NodeToDictCallbackis called for every node, in order to allow
modifications.
Return false to ignore this node or "skip" to include this node
without its children.
Toggle select all nodes.
InternalReturn readable string representation for this instance.
Schedule an update request to reflect a tree change.
The render operation is async and debounced unless the immediate option
is set.
Use WunderbaumNode.update if only a single node has changed, or WunderbaumNode._render) to pass special options.
Optionaloptions: UpdateOptionsUpdate a row to reflect a single node's modification.
Optionaloptions: UpdateOptionsRe-apply current filter.
Render pending changes that were scheduled using WunderbaumNode.update if any.
This is hardly ever neccessary, since we normally either
update(ChangeType.TYPE) (async, throttled), orupdate(ChangeType.TYPE, {immediate: true}) (synchronous)updatePendingModifications() will only force immediate execution of
pending async changes if any.
Call callback(node) for all nodes in hierarchical order (depth-first, pre-order).
the callback function. Return false to stop iteration, return "skip" to skip this node and children only.
false, if the iterator was stopped.
Call callback(node) for all nodes in vertical order, top down (or bottom up).
Note that this considers expansion state, i.e. filtered nodes and children
of collapsed nodes are skipped, unless includeHidden is set.
Stop iteration if callback() returns false.
Return false if iteration was stopped.
Optionaloptions: VisitRowsOptionsfalse if iteration was canceled
StaticgetReturn a {node: WunderbaumNode, region: TYPE} object for a mouse event.
Mouse event, e.g. click, ...
Return a {node: WunderbaumNode, region: TYPE} object TYPE: 'title' | 'prefix' | 'expander' | 'checkbox' | 'icon' | undefined
StaticgetReturn a WunderbaumNode instance from element or event.
StaticgetReturn a Wunderbaum instance, from element, id, index, or event.
getTree(); // Get first Wunderbaum instance on page
getTree(1); // Get second Wunderbaum instance on page
getTree(event); // Get tree for this mouse- or keyboard event
getTree("foo"); // Get tree for this `tree.options.id`
getTree("#tree"); // Get tree for first matching element selector
Optionalel: string | number | Element | Event | WunderbaumNode
A persistent plain object or array.
See also WunderbaumOptions.