Verint | Telligent Community
Verint | Telligent Community
  • Site
  • User
  • Site
  • Search
  • User
Verint Community 11.x
  • Verint Community
Verint Community 11.x
API Documentation glowTree jQuery Plugin
  • User Documentation
  • Ask the Community
  • API Documentation
  • Manager Training
  • Developer Training
  • Tags
  • More
  • Cancel
  • New
  • API Documentation
  • +In-Process API Documentation
  • +Plugin API Documentation
  • +REST API Documentation
  • -Widget, Theme, and Automation APIs
    • +Automation Events
    • -Client-side APIs
      • +Client Messages
      • +Composer Plugins
      • +JavaScript API Modules
      • +jQuery Events
      • -jQuery Plugins
        • dynamicForm jQuery Plugin
        • evolutionBookmark jQuery Plugin
        • evolutionCodeEditor jQuery Plugin
        • evolutionComposer jQuery Plugin
        • evolutionFeature jQuery Plugin
        • evolutionHighlight jQuery Plugin
        • evolutionHtmlEditor jQuery Plugin
        • evolutionInlineTagEditor jQuery Plugin
        • evolutionLike jQuery Plugin
        • evolutionMasonry jQuery Plugin
        • evolutionModerate jQuery Plugin
        • evolutionPager jQuery Plugin
        • evolutionProgressIndicator jQuery Plugin
        • evolutionResize jQuery Plugin
        • evolutionScrollSlider jQuery Plugin
        • evolutionSqueezeText jQuery Plugin
        • evolutionStarRating jQuery Plugin
        • evolutionTagTextBox jQuery Plugin
        • evolutionTextEditor jQuery Plugin
        • evolutionTheater jQuery Plugin
        • evolutionTip jQuery Plugin
        • evolutionToggleLink jQuery Plugin
        • evolutionTransform jQuery Plugin
        • evolutionUserFileTextBox jQuery Plugin
        • evolutionValidation jQuery Plugin
        • glowColorSelector jQuery Plugin
        • glowDropDownList jQuery Plugin
        • glowLookUptextBox jQuery Plugin
        • glowMultiUpload jQuery Plugin
        • glowOrderedList jQuery Plugin
        • glowPatternedTextBox jQuery Plugin
        • glowPopUpMenu jQuery Plugin
        • glowPopUpPanel jQuery Plugin
        • glowTabbedPanes jQuery Plugin
        • glowTabSet jQuery Plugin
        • glowTransition jQuery Plugin
        • glowTree jQuery Plugin
        • glowUpload jQuery Plugin
        • uilinks jQuery Plugin
      • +UI Components
    • +Dynamic Configuration
    • +LESS Functions
    • +Script API Types
    • +Script APIs

glowTree jQuery Plugin


jQuery.fn.glowTree

Renders a tree of nodes which can be navigated, manipulated, and re-arranged

Usage

$('SELECTOR').glowTree(options)

where 'SELECTOR' is a select element to be replaced with a tree control

Options

  • enableDragDrop: when enabled, allows rearranging of nodes within a tree via drag and drop
    • default: false
  • getSubNodes: callback function which defines how to retrieve sub-nodes for a given tree and node. Callback is passed parameters:
  1. tree
  2. node
  • canHaveChildren: whether a tree can have child nodes
    • default: true
  • nodeHtml: Array of strings, one per node
    • default: []
  • draggableTrees: when provided the id of another glowTree, nodes can be dragged from this tree to the tree identified by the id
    • default: null
  • expandedImageUrl: URL of image used alongside expanded tree nodes
    • default: ''
  • collapsedImageUrl: URL of image used alongside collapsed tree nodes
    • default: ''
  • blankImageUrl: URL of blank image for leaf nodes
    • default: ''

Events

  • glowTreeNodeSelected - triggered when a tree node is selected
  • glowTreeContextMenu - triggered when a tree node is right-clicked
  • glowTreeNodeRemoved - triggered when a tree node is removed from the tree
  • glowTreeNodeMoved - triggered when a tree node is moved in a tree
  • glowTreeNodeAdded - triggered when a tree node is added

Methods

getParentAndIndex

Returns the parent node and index based on a given coordinate pair. Generally used internally when dragging nodes between trees.

var nodeAndIndex = $('SELECTOR').glowTree('getParentAndIndex', x, y);

highlight

Sets whether a tree is highlighted

$('SELECTOR').glowTree('highlight', true);
$('SELECTOR').glowTree('highlight', false);

addDraggedNode

Adds a dragged node into a linked tree

$('SELECTOR').glowTree('addDraggedNode', node, nodeAndIndex.parentNode, nodeAndIndex.index, event);

selected

When not passed a node, returns the currently-selected node. When passed a node, selects the node in the tree

var selectedNode = $('SELECTOR').glowTree('selected');
$('SELECTOR').glowTree('selected', node);

resize

Resizes the tree to a given width and height in pixels

$('SELECTOR').glowTree('resize', x, y)

disabled

When not passed a value, returns whether the tree is disabled for interaction. When passed a boolean value, enables or disables the tree.

var isDisabled = $('SELECTOR').glowTree('disabled');
$('SELECTOR').glowTree('disabled', true);
$('SELECTOR').glowTree('disabled', false);

refresh

Re-renders the tree based on the currently-applied set of tree nodes

$('SELECTOR').glowTree('refresh')

add

Adds a new tree node to a tree

var newNode = $('SELECTOR').glowTree('createTreeNode', {
    value: 'abc',
    html: 'ABC'
});
$('SELECTOR').glowTree('add', newNode);

remove

Removes a given tree node instance from a tree

var node = $('SELECTOR').glowTree('getByValue', 'abc');
$('SELECTOR').glowTree('remove', node);

insert

Adds a new tree node to a tree at a given position

var newNode = $('SELECTOR').glowTree('createTreeNode', {
    value: 'abc',
    html: 'ABC'
});
$('SELECTOR').glowTree('add', newNode, 5);

getByValue

Find and return an existing node based on the node's value

var node = $('SELECTOR').glowTree('getByValue', 'abc')

getIndex

Return the position index for a given node

var index = $('SELECTOR').glowTree('getIndex', node)

getByIndex

Find and return an existing node based on the node's position index

var node = $('SELECTOR').glowTree('getByIndex', 4)

count

Returns the number of nodes in a given tree

var count = $('SELECTOR').glowTree('count')

createTreeNode

Creates a new tree node suitable for adding or inserting into a tree

var newNode = $('SELECTOR').glowTree('createTreeNode', {
    value: 'abc',
    html: 'ABC'
});

  • Share
  • History
  • More
  • Cancel
Related
Recommended
  • Telligent
  • Professional Services
  • Submit a Support Ticket
  • Become a Partner
  • Request a Demo
  • Contact Us

About
Privacy Policy
Terms of use
Copyright 2022 Verint, Inc.
Powered by Verint Community