Branch: master
Find file History
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
..
Failed to load latest commit information.
component.css
component.js
component.json
dependencies.html
example.html
picture.jpg
readme.md

readme.md

j-Tree

Configuration:

  • first {Boolean} selects the first tree item, default: true (optional)
  • exec {String} required: link to a function, this function is executed when the node is selected in the tree
  • autoreset {Boolean} resets state when datas-source is changed (optional, default: false)
  • selected {String} selected class (optional, default: selected)
  • checked {String} optional, a path to function(arr, component) or path to property
  • checkednested {Boolean} optional, checks all nested items (default: true)
  • upload {String} optional, a path to function(item, files) (enables drag & drop files)
  • dragdrop {String} optional, a path to function(item, target_item, itemel, targetel) (enables drag & drop items)
  • options {String} optional, a path to function(item, el) enables a small button for inline context menu for each item
  • rename {String} optional, a path to function(item, newname, fn_accept(true))
  • unselectexpand {Boolean} optional, can unselect selected item when the user clicks on the expandable item (default: false)
  • reselect {Boolean} optional, evaluates exec again if the tree is refreshed (default: false)

Data structure:

  • Object Array
  • Object has to contain name:String and children:[another similar object] or children:null (with no children)
  • Object item can contain ..., icon: 'home' }, it can change a file icon
  • Object item can contain ..., classname: 'css_custom_class' }, it adds a CSS class onto "label" element

Methods:

  • component.expand([index]) - expands index or all (with no defined index) nodes
  • component.collapse([index]) - collapses index or all (with no defined index) nodes
  • component.clear() - clears a cache for refreshing source
  • component.select(index) - selects node
  • component.unselect() - unselects node
  • component.rename(index) - shows input for name renaming (it works with config.rename)

Good to know:

Setter automatically extends each object by adding .$pointer property with a tree index.

Author