/NgHierarchicalSelector

A Hierarchical/Tree Selector control for AngularJS

Primary LanguageJavaScriptMIT LicenseMIT

Angular tree-selector directive

Hierarchical (or tree) selector for AngularJS. It can either have the whole data structure (a tree) passed to it or set to asynchronously load each level via a callback. It also allows auto-complete searching of the tree, optional multiple selection and keyboard navigation.

Features

  • Select data from a hierarchical/tree structure
  • Asynchronously loading of children, or not
  • Keyboard navigation

Build

To build this repository, you will need Node v6.11.5. For the changes to take effect, run npm run build here, merge the new build files (under release/) to master, and run bower update in the repositories where you need the changes.

Check it out

http://lukemurray.github.io/NgHierarchicalSelector/

Release notes

v0.4.0

  • Added placeholder text functionality

v0.3.4

  • Fix issue with input control not expanding with many selected items

v0.3.3

  • Fix a post back issue for ASP.NET on some browsers

v0.3.2

  • Fix an issue with when the selection attribute is null/undefined

v0.3.1

  • Added in call back to get the tag name
  • Ability to set the initial selected item.

v0.3

  • Added in feedback about the async children loading
  • Default button to show the tree on the right side of control. Use no-button attribute to hide it

TODO

  • Tests
    • yep, should be writing these
  • Docs
    • CSS customisation
  • general
    • set up some repeatable way to do a release
    • add to bower
    • set up CI for the project
  • tree
    • option for parent select selects all children
  • autocomplete typing
    • allow typing at the end of the selected items
    • auto complete list for typing
    • no typing at the end if item selected and not multi select
    • support async for auto complete
  • input control
    • remove selected items by keyboard
  • tree
    • disabled items
    • option for no check boxes in multi select?
    • keyboard, left on a chile node should make the parent the active node
  • popup
    • better positioning of popup when at bottom/edges etc.

Requirements

  • AngularJS 1.3

CSS

.expando - Change the expand marker style .expando-opened - Change the collapse marker style

Contributing

Please do it.

Building

Gulp is used to build the project ('npm install' will install the gulp dependencies).

  • gulp build will build is for local development
  • gulp rel-patch will bump the version and build a release version
  • gulp rel-minor will bump the version and build a release version
  • gulp watch with run 'build' and watch for changes

Testing

...