Web Component: j-Children

  • Info
  • HTML
  • JS
  • CSS
  • Meta


The component renders draggable items as a tree without the possibility of collapsing. Data-Source must be Object Array in the form: { id: String, children: [ ], YOUR PROPERTIES }, { ... }


  • empty {String} an empty text (default: null)
  • onchange {String} optional, a link to the function(arr) - captures items when resorted


{{ level }} contains a level (number)
{{ value }} contains an item (object)

Try to understand the functionality from the example.

Good to know:

  • component.items {Object} contains all references of all items in the form items[item.id] = item
  • component.parents {Object} contains all references of all parents in the form parents[item.id] = parent