Questions tagged [jstree]

jsTree is a JavaScript-based, cross-browser tree component packaged as a jQuery plugin.

jsTree is jquery plugin written by Ivan Bozhanov, that provides interactive trees. It is absolutely free, open source and distributed under the MIT License. jsTree is easily extendable, themable and configurable, it supports HTML & JSON data sources and AJAX loading.

jsTree functions properly in either box-model (content-box or border-box), can be loaded as an AMD module, and has a built in mobile theme for responsive design, that can easily be customized. It uses jQuery's event system, so binding callbacks on various events in the tree is familiar and easy.

Just a few of the features worth noting:

  • drag & drop support
  • keyboard navigation
  • inline edit, create and delete
  • tri-state checkboxes
  • fuzzy searching
  • customizable node types

It supports multiple browsers including Internet Explorer 8+, Mozilla Firefox, Safari, Opera and Google Chrome, as well as most mobile browsers.

See also:

2044 questions
11
votes
6 answers

jsTree Hide Checkbox

I am using the jsTree jQuery plugin to display a 5 level deep tree. I would like to not show checkboxes on the last level. Is there any way to do that in the setting or some jquery processing I can do afterwards to remove those checkboxes? I am…
jrock10
  • 388
  • 1
  • 4
  • 12
11
votes
1 answer

JsTree checkbox - check event

I have this JsTree with this code: var Tree = $("#MyTree"); Tree.jstree({ "core": { "themes": { "responsive": false, "multiple" : false, }, …
Lorenzo Grossi
  • 430
  • 1
  • 5
  • 22
11
votes
5 answers

How do I get leaf nodes in jstree to open their hyperlink when clicked when using jstree ui?

I display a hierachial structure using jtree, the data is as follows
10
votes
2 answers

jQuery JsTree and JSON error handling

I am using MVC to pass JSON data to JsTree and show a hierarchical view of information. Everything is working just fine, however, there are times when the user does not have access the the data or for some reason the MVC action throws an…
sam360
  • 1,121
  • 3
  • 18
  • 37
10
votes
5 answers

how to get the metadata of jsTree.

This is my code: $("#demo1").jstree({ "themes": { "theme": "default", "dots": true, "icons": true, "url": "static/themes/default/style.css" }, "ui" : { // this…
zjm1126
  • 34,604
  • 53
  • 121
  • 166
9
votes
2 answers

jstree disable checkbox

I am currently working on some POC using JS Tree plugin and related check box plugin. For certain nodes I need to check the check box by default and disable any further selection.I found the function to hide the check box .bind("load_node.jstree",…
Pavan Josyula
  • 1,355
  • 3
  • 13
  • 25
9
votes
2 answers

JsTree: How to sort jstree nodes with folders at the top

I use the plugin Jstree to draw a tree of folders ans files. I want to get the list of folders at the top then the list of files (the list of folders and files must be sorted in alphabetical order). There is my function of initilization of the…
Aminesrine
  • 2,082
  • 6
  • 35
  • 64
9
votes
4 answers

Disable the whole jsTree

I'm using jsTree and have a form on the right of it based on the selected node that can be edited/saved. The goal is to prevent the user from clicking anywhere else on the tree while they are editing the form. Is there any way to temp…
Narine Cholakian
  • 189
  • 1
  • 2
  • 13
9
votes
3 answers

How to get node by ID in Jstree

I have created a jstree and i have a problem with getting node by id of jstree. when i use get_node, i get an error: TypeError: $(...).jstree.get_node is not a function this is html code:
ZSH
  • 631
  • 5
  • 16
  • 36
9
votes
1 answer

JsTree with custom json data

I have this structure in json I can not be modified by request. { "Object": [ { "url": "http://www.google.com" } ], "id": 1, "name": "Redirection Rule", …
Crapo Wolf
  • 2,241
  • 2
  • 11
  • 20
9
votes
3 answers

how to deselect all element in jquery?

I want to deselect (remove selected element ).I am using jstree in my demo .So I read the plugin api . http://www.jstree.com/api/#/?f=deselect_all([supress_event]). But it not deleselect the selected item. I follow the these steps 1) Click the "b"…
user1542984
9
votes
2 answers

Jstree state plugin not saving tree state

Adding the state plugin in Jstree is still not saving the state of the tree between page refresh or after clicking link and going back to previous page $('#myGrid').jstree({ "types": { "key": { "icon":…
Amda
  • 91
  • 1
  • 3
9
votes
3 answers

How do I make jstree to select node only on left click?

Currently both left and right click select the node which interferes contextmenu as I use left clicks to go to other pages. How do I make select_node.jstree event know which mouse button is being clicked?
Alexander Suraphel
  • 10,103
  • 10
  • 55
  • 90
9
votes
5 answers

Get the selected Node from a jstree

I am trying to get the selected Node from a jstree. This is the code in the View
9
votes
4 answers

jstree performance issues

I am using a jsTree with around 1500 nodes, nested to a max of 4 levels (most are only 1 level deep), and I'm getting Internet Explorer's "this script is running slowly" error. I began with just a straight html_data
  • structure, generated by…
  • mike
    • 536
    • 1
    • 6
    • 16