Add to Favorites

Fun with jstree

I was recently tasked with creating a more flexible system to re-arrange a tree structure from the database. Nobody enjoys managing a tree in the same old way with static html, navigating down the tree, choosing options from a dropdown on where to move an object, saving, and then navigating back out.

To give the user a better interface to do these sort of tree management tasks, I implemented jstree. Jstree is a nice little javascript built on top of the jquery javascript library. The learning curve to setup a custom jstree implementation on top of an existing php structure wasn't huge, but it wasn't instant either. This trade off comes with a great payoff, the flexibility and feature list of the well fleshed out jstree.

After setting up the call to initialize the jstree instance using ajax, I was able to hook up all the necessary parts in order to make the component talk back and forth to a php backend to perform the necessary operations. I was greatly pleased by the flexibility in the configuration options and callbacks. With a little more digging I was able to setup custom icons for different items and states of items in the tree.

Comments

Be the first to leave a comment on this post.

Leave a comment

To leave a comment, please log in / sign up