The only required part of jstree it consists of a few functions bound to the $.jstree object, the actual plugin function and a few core functions for manipulating a tree.
| jstree. | The only required part of jstree it consists of a few functions bound to the $.jstree object, the actual plugin function and a few core functions for manipulating a tree. |
| $.jstree. | Some static functions and variables, unless you know exactly what you are doing do not use these, but $().jstree instead. |
| $.jstree | object Contains all static functions and variables used by jstree, some plugins also append variables. |
| $.jstree. | string the version of jstree |
| $.jstree. | boolean indicating if the client is running Internet Explorer 6 |
| $.jstree. | boolean indicating if the client is running Internet Explorer 7 |
| $.jstree. | boolean indicating if the client is running Firefox 2 |
| $.jstree. | Creates a new jstree instance, any arguments after the first one are merged and used to configure the tree. |
| $.jstree. | |
| $.jstree. | Destroys an instance, and also clears `jstree-` prefixed classes and all events in the `jstree` namespace |
| $.jstree. | Call a function on the instance and return the result |
| $.jstree. | Returns an instance |
| $.jstree. | Returns the currently focused instance (by default once an instance is created it is focused) |
| $.jstree. | Make an instance focused (which defocuses the previously focused instance) |
| $.jstree. | Register a plugin |
| $.jstree. | object storing all the default configuration options for every plugin and the core. |
| $().jstree() | The actual plugin wrapper, use this to create instances or execute functions on created instances. |
| $().jstree | Creates an instance using the specified objects for containers, or executes a command on an instance, specified by a container. |
| $.jstree. | |
| $.jstree. | integer indicating the width of the client scrollbar |
| jstree | |
| data | object Provides storage for plugins (aside from private variables). |
| get_index | Returns an integer, which is the instance’s index. |
| get_container | Returns the jQuery extended container of the tree (the element you used when constructing the tree). |
| get_container_ul | Returns the jQuery extended first UL node inside the container of the tree. |
| get_settings | Returns the settings for the tree. |
| __trigger | Used internally to trigger events on the container node. |
| CORE options | |
| config. | mixed used to store all localization strings. |
| CORE functions | |
| _get_string | Used to get the common string in the tree. |
| init | Used internally. |
| __loaded | This event is triggered in the jstree namespace when data is first rendered in the tree. |
| __ready | This event is triggered in the jstree namespace when all initial loading is done. |
| lock | Used to lock the tree. |
| lock | This event is triggered in the jstree namespace when the tree is locked. |
| unlock | Used to unlock the tree. |
| unlock | This event is triggered in the jstree namespace when the tree is unlocked. |
| is_locked | Used to get the locked status of the tree. |
| get_node | Get a hold of the LI node (which represents the jstree node). |
| get_next | Get the next sibling of a node |
| get_prev | Get the previous sibling of a node |
| get_parent | Get the parent of a node |
| get_children | Get all the children of a node |
| is_parent | Check if a node is a parent. |
| is_loaded | Check if a node is loaded. |
| is_loading | Check if a node is currently loading. |
| is_open | Check if a node is currently open. |
| is_closed | Check if a node is currently closed. |
| is_leaf | Check if a node is a leaf node (has no children). |
| load_node | Load the children of a node. |
| load_node | This event is triggered in the jstree namespace when a node is loaded (succesfully or not). |
| _load_node | Load the children of a node, but as opposed to load_node does not change any visual properties or trigger events. |
| open_node | Open a node so that its children are visible. |
| open_node | This event is triggered in the jstree namespace when a node is successfully opened (but if animation is used this event is triggered BEFORE the animation completes). |
| __after_open | This event is triggered in the jstree namespace when a node is successfully opened AFTER the animation completes). |
| close_node | Close a node so that its children are not visible. |
| close_node | This event is triggered in the jstree namespace when a node is closed (but if animation is used this event is triggered BEFORE the animation completes). |
| __after_close | This event is triggered in the jstree namespace when a node is closed AFTER the animation completes). |
| toggle_node | |
| open_all | Open all nodes from a certain node down. |
| open_all | This event is triggered in the jstree namespace when an open_all call completes. |
| close_all | Close all nodes from a certain node down. |
| close_all | This event is triggered in the jstree namespace when a close_all call completes. |
| clean_node | This function converts inserted nodes to the required by jsTree format. |
| correct_node | This function corrects the open/closed/leaf state as data changes (as the user interacts with the tree). |
| scroll_to_node | This function scrolls the container to the desired node (if needed). |
| get_state | This function returns the current state of the tree (as collected from all active plugins). |
| set_state | This function returns sets the state of the tree. |
| set_state | This event is triggered in the jstree namespace when a set_state call completes. |
| refresh | This function saves the current state, reloads the complete tree and returns it to the saved state. |
| refresh | This event is triggered in the jstree namespace when a refresh call completes. |
| get_text | This function returns the title of the node. |
| set_text | This function sets the title of the node. |
| set_text | This event is triggered in the jstree namespace when a set_text call completes. |
| parse_json | This function returns a jQuery node after parsing a JSON object (a LI node for single elements or an UL node for multiple). |
| get_json | This function returns the whole tree (or a single node) in JSON format. |
| create_node | This function creates a new node. |
| create_node | This event is triggered in the jstree namespace when a new node is created. |
| rename_node | This function renames a new node. |
| rename_node | This event is triggered in the jstree namespace when a node is renamed. |
| delete_node | This function deletes a node. |
| delete_node | This event is triggered in the jstree namespace when a node is deleted. |
| check | This function checks if a structure modification is valid. |
| move_node | This function moves a node. |
| move_node | This event is triggered in the jstree namespace when a node is moved. |
| copy_node | This function copies a node. |
| copy_node | This event is triggered in the jstree namespace when a node is copied. |
Some static functions and variables, unless you know exactly what you are doing do not use these, but $().jstree instead.
Creates a new jstree instance, any arguments after the first one are merged and used to configure the tree.
`.data(“jstree”)` is also called on the container and is used for configuration (keep in mind you can specify this data using a “data-jstree” attribute)
| container | mixed the container of the tree (this should not be the UL node, but a wrapper) - DOM node, jQuery object or selector |
Destroys an instance, and also clears `jstree-` prefixed classes and all events in the `jstree` namespace
| instance | mixed the instance to destroy (this argument is passed to $.jstree._reference to get the instance) |
Call a function on the instance and return the result
| instance | mixed the instance to destroy (this argument is passed to $.jstree._reference to get the instance) |
| operation | string the operation to execute |
| args | array the arguments to pass to the function |
Make an instance focused (which defocuses the previously focused instance)
| instance | mixed the instance to focus (this argument is passed to $.jstree._reference to get the instance) |
Register a plugin
| plugin_name | string the name of the new plugin (it will be used as a key in an object - make sure it is valid) |
| plugin_data | object consists of 4 keys. Default is: |
{
__construct : $.noop, // this function will be executed when a new instance is created
__destuct : $.noop, // this function will be executed when an instance is destroyed
_fn : { }, // each key of this object should be a function that will extend the jstree prototype
defaults : false // the default configuration for the plugin (if any)
}object storing all the default configuration options for every plugin and the core. If this is modified all instances created after the modification, which do not explicitly specify some other value will use the new default.
// this instance will use the _default_ theme
$("#div0").jstree({ plugins : ["themes"] });
$.jstree.defaults.themes.theme = "classic";
// this instance will use the _classic_ theme
$("#div1").jstree({ plugins : ["themes"] });
// this instance will use the _apple_ theme
$("#div2").jstree({ themes : { "theme" : "apple" }, plugins : ["themes"] });
$.fn.jstree = function ( settings )
Creates an instance using the specified objects for containers, or executes a command on an instance, specified by a container.
| settings | mixed |
// this creates an instance
$("#some-id").jstree({
plugins : [ "html_data", "themes", "ui" ]
});
// this executes a function on the instance
$("#some-id").jstree("select_node", "#the-id-to-select");| data | object Provides storage for plugins (aside from private variables). |
| get_index | Returns an integer, which is the instance’s index. |
| get_container | Returns the jQuery extended container of the tree (the element you used when constructing the tree). |
| get_container_ul | Returns the jQuery extended first UL node inside the container of the tree. |
| get_settings | Returns the settings for the tree. |
| __trigger | Used internally to trigger events on the container node. |
| CORE options | |
| config. | mixed used to store all localization strings. |
| CORE functions | |
| _get_string | Used to get the common string in the tree. |
| init | Used internally. |
| __loaded | This event is triggered in the jstree namespace when data is first rendered in the tree. |
| __ready | This event is triggered in the jstree namespace when all initial loading is done. |
| lock | Used to lock the tree. |
| lock | This event is triggered in the jstree namespace when the tree is locked. |
| unlock | Used to unlock the tree. |
| unlock | This event is triggered in the jstree namespace when the tree is unlocked. |
| is_locked | Used to get the locked status of the tree. |
| get_node | Get a hold of the LI node (which represents the jstree node). |
| get_next | Get the next sibling of a node |
| get_prev | Get the previous sibling of a node |
| get_parent | Get the parent of a node |
| get_children | Get all the children of a node |
| is_parent | Check if a node is a parent. |
| is_loaded | Check if a node is loaded. |
| is_loading | Check if a node is currently loading. |
| is_open | Check if a node is currently open. |
| is_closed | Check if a node is currently closed. |
| is_leaf | Check if a node is a leaf node (has no children). |
| load_node | Load the children of a node. |
| load_node | This event is triggered in the jstree namespace when a node is loaded (succesfully or not). |
| _load_node | Load the children of a node, but as opposed to load_node does not change any visual properties or trigger events. |
| open_node | Open a node so that its children are visible. |
| open_node | This event is triggered in the jstree namespace when a node is successfully opened (but if animation is used this event is triggered BEFORE the animation completes). |
| __after_open | This event is triggered in the jstree namespace when a node is successfully opened AFTER the animation completes). |
| close_node | Close a node so that its children are not visible. |
| close_node | This event is triggered in the jstree namespace when a node is closed (but if animation is used this event is triggered BEFORE the animation completes). |
| __after_close | This event is triggered in the jstree namespace when a node is closed AFTER the animation completes). |
| toggle_node | |
| open_all | Open all nodes from a certain node down. |
| open_all | This event is triggered in the jstree namespace when an open_all call completes. |
| close_all | Close all nodes from a certain node down. |
| close_all | This event is triggered in the jstree namespace when a close_all call completes. |
| clean_node | This function converts inserted nodes to the required by jsTree format. |
| correct_node | This function corrects the open/closed/leaf state as data changes (as the user interacts with the tree). |
| scroll_to_node | This function scrolls the container to the desired node (if needed). |
| get_state | This function returns the current state of the tree (as collected from all active plugins). |
| set_state | This function returns sets the state of the tree. |
| set_state | This event is triggered in the jstree namespace when a set_state call completes. |
| refresh | This function saves the current state, reloads the complete tree and returns it to the saved state. |
| refresh | This event is triggered in the jstree namespace when a refresh call completes. |
| get_text | This function returns the title of the node. |
| set_text | This function sets the title of the node. |
| set_text | This event is triggered in the jstree namespace when a set_text call completes. |
| parse_json | This function returns a jQuery node after parsing a JSON object (a LI node for single elements or an UL node for multiple). |
| get_json | This function returns the whole tree (or a single node) in JSON format. |
| create_node | This function creates a new node. |
| create_node | This event is triggered in the jstree namespace when a new node is created. |
| rename_node | This function renames a new node. |
| rename_node | This event is triggered in the jstree namespace when a node is renamed. |
| delete_node | This function deletes a node. |
| delete_node | This event is triggered in the jstree namespace when a node is deleted. |
| check | This function checks if a structure modification is valid. |
| move_node | This function moves a node. |
| move_node | This event is triggered in the jstree namespace when a node is moved. |
| copy_node | This function copies a node. |
| copy_node | This event is triggered in the jstree namespace when a node is copied. |
Returns the settings for the tree.
| writable | boolean whether to return a copy of the settings object or a reference to it. |
$("#div1").jstree("get_settings"); // will return a copy
$.jstree._reference("#div1").get_settings(); // same as above
$.jstree._focused().get_settings(true); // a reference. BE CAREFUL!Used internally to trigger events on the container node.
| event_name | the name of the event to trigger (the jstree namespace will be appended to it) |
| data | the additional object to pass along with the event. By default data.inst will be the current instance, so when you bind to the event, you can access the instance easily. |
$("div").bind("some-event.jstree", function (e, data) { data.inst.some_function(); });mixed used to store all localization strings. Default is false.
$("div").jstree({
core : {
strings : function (s) {
if(s === "Loading ...") { s = "Please wait ..."; }
return s;
}
}
});$("div").jstree({
core : {
strings : {
"Loading ..." : "Please wait ..."
}
}
});
_get_string : function ( s )
Used to get the common string in the tree.
If config.core.strings is set to a function, that function is called with a single parameter (the needed string), the response is returned.
If config.core.strings is set to an object, the key named as the needed string is returned.
If config.core.strings is not set, the the needed string is returned.
| needed_string | string the needed string |
This event is triggered in the jstree namespace when the tree is locked.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else). |
| data.rslt | null |
$("div").bind("lock.jstree", function (e, data) { data.inst.do_something(); });This event is triggered in the jstree namespace when the tree is unlocked.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else). |
| data.rslt | null |
$("div").bind("unlock.jstree", function (e, data) { data.inst.do_something(); });
get_node : function ( obj )
Get a hold of the LI node (which represents the jstree node).
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. |
| jquery collection | node was found, the collection contains the LI node |
| -1 | the tree container was referenced |
| false | on failure (obj is not part of a tree, or does not exists in the DOM) |
get_next : function ( obj, strict )
Get the next sibling of a node
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. |
| strict | boolean if set to true jstree will only return immediate siblings, otherwise, if obj is the last child of its parent, the parent’s next sibling is returned. |
| jquery collection | node was found, the collection contains the LI node |
| -1 | the tree container was referenced |
| false | node was not found, or failure (obj is not part of a tree, or does not exists in the DOM) |
get_prev : function ( obj, strict )
Get the previous sibling of a node
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. |
| strict | boolean if set to true jstree will only return immediate siblings, otherwise, if obj is the first child of its parent, the parent’s previous sibling is returned. |
| jquery collection | node was found, the collection contains the LI node |
| -1 | the tree container was referenced |
| false | node was not found, or failure (obj is not part of a tree, or does not exists in the DOM) |
get_parent : function ( obj )
Get the parent of a node
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. |
| jquery collection | node was found, the collection contains the LI node |
| -1 | when obj was a root node |
| false | on failure (obj is not part of a tree, or does not exists in the DOM) |
get_children : function ( obj )
Get all the children of a node
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. If -1 is used all root nodes are returned. |
| jquery collection | node was found, the collection contains the LI nodes of all immediate children |
| false | on failure (obj is not part of a tree, or does not exists in the DOM) |
Load the children of a node.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. Use -1 to load the root nodes. |
| callback | a function to be executed in the tree’s scope. Receives two arguments: obj (the same node used to call load_node), status (a boolean indicating if the node was loaded successfully. |
| true | obj is a valid node and will try loading it |
| false | obj is not a valid node |
This event is triggered in the jstree namespace when a node is loaded (succesfully or not).
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else). |
| data.rslt | object which contains two keys obj (the loaded node) and status - whether the node was loaded successfully. |
$("div").bind("load_node.jstree", function (e, data) { if(data.rslt.status) { data.inst.open_node(data.rslt.obj); } });
_load_node : function ( obj, callback )
Load the children of a node, but as opposed to load_node does not change any visual properties or trigger events. This function is used in load_node internally. The idea is for data source plugins to overwrite this function. This implementation (from the core) only uses markup found in the tree container, and does not load async.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. Use -1 to load the root nodes. |
| callback | a function to be executed in the tree’s scope. Receives one argument: status (a boolean indicating if the node was loaded successfully). |
Open a node so that its children are visible. If the node is not loaded try loading it first.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. |
| callback | a function to be executed in the tree’s scope. Receives two arguments: obj (the node being opened) and status (a boolean indicating if the node was opened successfully). |
| animation | the duration in miliseconds of the slideDown animation. If not supplied the jQuery default is used. Please note that on IE6 a 0 is enforced here due to performance issues. |
This event is triggered in the jstree namespace when a node is successfully opened (but if animation is used this event is triggered BEFORE the animation completes). See __after_open.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else). |
| data.rslt | object which contains a single key: obj (the opened node). |
$("div").bind("open_node.jstree", function (e, data) {
data.rslt.obj.find('> ul > .jstree-closed').each(function () {
data.inst.open_node(this);
}
});This event is triggered in the jstree namespace when a node is successfully opened AFTER the animation completes). See open_node.
| data.inst | the instance |
| data.rslt | object which contains a single key: obj (the opened node). |
$("div").bind("__after_open.jstree", function (e, data) {
data.rslt.obj.find('> ul > .jstree-closed').each(function () {
data.inst.open_node(this);
}
});Close a node so that its children are not visible.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. |
| animation | the duration in miliseconds of the slideDown animation. If not supplied the jQuery default is used. Please note that on IE6 a 0 is enforced here due to performance issues. |
This event is triggered in the jstree namespace when a node is closed (but if animation is used this event is triggered BEFORE the animation completes). See __after_close.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else). |
| data.rslt | object which contains a single key: obj (the closed node). |
$("div").bind("close_node.jstree", function (e, data) {
data.rslt.obj.children('ul').remove();
});This event is triggered in the jstree namespace when a node is closed AFTER the animation completes). See close_node.
| data.inst | the instance |
| data.rslt | object which contains a single key: obj (the opened node). |
$("div").bind("__after_close.jstree", function (e, data) {
data.rslt.obj.children('ul').remove();
});Open all nodes from a certain node down.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. If -1 is used or is omitted all nodes in the tree are opened. |
| animation | the duration of the slideDown animation when opening the nodes. If not set 0 is enforced for performance issues. |
| original_obj | used internally to keep track of the recursion - do not set manually! |
This event is triggered in the jstree namespace when an open_all call completes.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else). |
| data.rslt | object which contains a single key: obj (the node used in the call). |
$("div").bind("open_all.jstree", function (e, data) {
alert('DONE');
});Close all nodes from a certain node down.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. If -1 is used or is omitted all nodes in the tree are closed. |
| animation | the duration of the slideDown animation when closing the nodes. If not set 0 is enforced for performance issues. |
This event is triggered in the jstree namespace when a close_all call completes.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else). |
| data.rslt | object which contains a single key: obj (the node used in the call). |
$("div").bind("close_all.jstree", function (e, data) {
alert('DONE');
});
clean_node : function ( obj )
This function converts inserted nodes to the required by jsTree format. It takes care of converting a simple unodreder list to the internally used markup. The core calls this function automatically when new data arrives (by binding to the load_node event). Each plugin may override this function to include its own source, but keep in mind to do it like that:
clean_node : function(obj) {
obj = this.__call_old();
obj.each(function () {
// do your stuff here
});
}| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. If -1 is used or is omitted all nodes in the tree are cleaned. |
| jQuery collection | the cleaned children of the original node. |
This function corrects the open/closed/leaf state as data changes (as the user interacts with the tree). The core calls this function automatically when a node is opened, deleted or moved.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. If -1 is used or is omitted the root nodes are processed. |
| jQuery collection | the processed children of the original node. |
get_state : function ()
This function returns the current state of the tree (as collected from all active plugins). Plugin authors: pay special attention to the way this function is extended for new plugins. In your plugin code write:
get_state : function () {
var state = this.__call_old();
state.your-plugin-name = <some-value-you-collect>;
return state;
}| object | the current state of the instance |
This function returns sets the state of the tree. Plugin authors: pay special attention to the way this function is extended for new plugins. In your plugin code write:
set_state : function (state, callback) {
if(this.__call_old()) {
if(state.your-plugin-name) {
// restore using `state.your-plugin-name`
// if you need some async activity so that you return to this bit of code
// do not delete state.your-plugin-name and return false (see core's function for example)
delete state.your-plugin-name;
this.set_state(state, callback);
return false;
}
return true;
}
return false;
}| state | object the state to restore to |
| callback | function this will be executed in the instance’s scope once restoring is done |
| boolean | the return value is used to determine the phase of restoration |
get_text : function ( obj, remove_html )
This function returns the title of the node.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. |
| remove_html | boolean set to true to return plain text instead of HTML |
| string | the title of the node, specified by obj |
This function sets the title of the node. This is a low-level function, you’d be better off using <rename>.
| obj | mixed this is used as a jquery selector - can be jQuery object, DOM node, string, etc. |
| val | string the new title of the node (can be HTMl too) |
| boolean | was the rename successfull |
This event is triggered in the jstree namespace when a set_text call completes.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else) |
| data.rslt | object which contains a two keys: obj (the node) and val (the new title). |
$("div").bind("set_text.jstree", function (e, data) {
alert("Renamed to: " + data.rslt.val);
});
parse_json : function ( node )
This function returns a jQuery node after parsing a JSON object (a LI node for single elements or an UL node for multiple). This function will use the default title from jstree.config.core.strings if none is specified.
| node | mixed the input to parse |
// can be a string
"The title of the parsed node"
// array of strings
[ "Node 1", "Node 2" ]
// an object
{ "title" : "The title of the parsed node" }
// you can manipulate the output
{ "title" : "The title of the parsed node", "li_attr" : { "id" : "id_for_li" }, "a_attr" : { "href" : "http://jstree.com" } }
// you can supply metadata, which you can later access using $(the_li_node).data()
{ "title" : "The title of the parsed node", "data" : { <some-values-here> } }
// you can supply children (they can be objects too)
{ "title" : "The title of the parsed node", "children" : [ "Node 1", { "title" : "Node 2" } ] }| jQuery | the LI (or UL) node which was produced from the JSON |
get_json : function ( obj, is_callback )
This function returns the whole tree (or a single node) in JSON format. Each plugin may override this function to include its own source, but keep in mind to do it like that:
get_json : function(obj, is_callback) {
var r = this.__call_old();
if(is_callback) {
if(<some-condition>) { r.data.jstree.<some-key> = <some-value-this-plugin-will-process>; }
}
return r;
}| obj | mixed the input to parse |
| is_callback | do not modify this, jstree uses this parameter to keep track of the recursion |
| Array | an array consisting of objects (one for each node) |
This function creates a new node.
| parent | mixed the parent for the newly created node. This is used as a jquery selector, can be jQuery object, DOM node, string, etc. Use -1 to create a new root node. |
| node | mixed the input to parse, check parse_json for description |
| position | mixed where to create the new node. Can be one of “before”, “after”, “first”, “last”, “inside” or a numerical index. |
| callback | optional function to be executed once the node is created |
| is_loaded | used internally when a node needs to be loaded - do not pass this |
| jQuery | the LI node which was produced from the JSON (may return undefined if the parent node is not yet loaded, but will create the node) |
This event is triggered in the jstree namespace when a new node is created.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else) |
| data.rslt | object which contains a three keys: obj (the node), parent (the parent) and position which is the numerical index. |
$("div").bind("create_node.jstree", function (e, data) {
alert("Created `" + data.inst.get_text(data.rslt.obj) + "` inside `" + (data.rslt.parent === -1 ? 'the main container' : data.inst.get_text(data.rslt.parent)) + "` at index " + data.rslt.position);
});This event is triggered in the jstree namespace when a node is renamed.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else) |
| data.rslt | object which contains a three keys: obj (the node), title (the new title), old (the old title) |
$("div").bind("rename_node.jstree", function (e, data) {
alert("Node rename from `" + data.rslt.old + "` to `" + data.rslt.title "`");
});This event is triggered in the jstree namespace when a node is deleted.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else) |
| data.rslt | object which contains a three keys: obj (the removed node), prev (the previous sibling of the removed node), parent (the parent of the removed node) |
$("div").bind("delete_node.jstree", function (e, data) {
alert("Node deleted!");
});
check : function ( chk, obj, par, pos )
This function checks if a structure modification is valid.
| chk | string what are we checking (copy_node, move_node, rename_node, create_node, delete_node) |
| obj | mixed the node. |
| par | mixed the parent (if dealing with a move or copy - the new parent). |
| pos | mixed the index among the parent’s children (or the new name if dealing with a rename) |
| is_copy | boolean is this a copy or a move call |
| boolean | true if the move is valid, false otherwise |
This function moves a node.
| obj | mixed the node to move. This is used as a jquery selector, can be jQuery object, DOM node, string, etc. |
| parent | mixed the new parent. This is used as a jquery selector, can be jQuery object, DOM node, string, etc. Use -1 to promote to a root node. |
| position | mixed where to create the new node. Can be one of “before”, “after”, “first”, “last”, “inside” or a numerical index. |
| callback | optional function to be executed once the node is moved |
| is_loaded | used internally when a node needs to be loaded - do not pass this |
| boolean | indicating if the move was successfull (may return undefined if the parent node is not yet loaded, but will move the node) |
This event is triggered in the jstree namespace when a node is moved.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else) |
| data.rslt | object which contains a five keys: obj (the node), parent (the new parent) and position which is the numerical index, old parent (the old parent) and is_multi (a boolean indicating if the node is coming from another tree instance) |
$("div").bind("move_node.jstree", function (e, data) {
alert("Moved `" + data.inst.get_text(data.rslt.obj) + "` inside `" + (data.rslt.parent === -1 ? 'the main container' : data.inst.get_text(data.rslt.parent)) + "` at index " + data.rslt.position);
});This function copies a node.
| obj | mixed the node to copy. This is used as a jquery selector, can be jQuery object, DOM node, string, etc. |
| parent | mixed the new parent. This is used as a jquery selector, can be jQuery object, DOM node, string, etc. Use -1 to promote to a root node. |
| position | mixed where to create the new node. Can be one of “before”, “after”, “first”, “last”, “inside” or a numerical index. |
| callback | optional function to be executed once the node is moved |
| is_loaded | used internally when a node needs to be loaded - do not pass this |
| boolean | indicating if the move was successfull (may return undefined if the parent node is not yet loaded, but will move the node) |
This event is triggered in the jstree namespace when a node is copied.
| data.inst | the instance |
| data.args | array the arguments passed to the function |
| data.plugin | string the function’s plugin (here it will be ”core” but if the function is extended it may be something else) |
| data.rslt | object which contains a five keys: obj (the node), parent (the new parent) and position which is the numerical index, original (the original object) and is_multi (a boolean indicating if the node is coming from another tree instance) |
$("div").bind("copy_node.jstree", function (e, data) {
alert("Copied `" + data.inst.get_text(data.rslt.original) + "` inside `" + (data.rslt.parent === -1 ? 'the main container' : data.inst.get_text(data.rslt.parent)) + "` at index " + data.rslt.position);
});object Contains all static functions and variables used by jstree, some plugins also append variables.
$.jstree
integer indicating the width of the client scrollbar
$.jstree.SCROLLBAR_WIDTH
Used to get the common string in the tree.
_get_string : function ( s )
Used to get the locked status of the tree.
is_locked : function ()
Get a hold of the LI node (which represents the jstree node).
get_node : function ( obj )
Get the next sibling of a node
get_next : function ( obj, strict )
Get the previous sibling of a node
get_prev : function ( obj, strict )
Get the parent of a node
get_parent : function ( obj )
Get all the children of a node
get_children : function ( obj )
Check if a node is a parent.
is_parent : function ( obj )
Check if a node is loaded.
is_loaded : function ( obj )
Check if a node is currently loading.
is_loading : function ( obj )
Check if a node is currently open.
is_open : function ( obj )
Check if a node is currently closed.
is_closed : function ( obj )
Check if a node is a leaf node (has no children).
is_leaf : function ( obj )
Load the children of a node, but as opposed to load_node does not change any visual properties or trigger events.
_load_node : function ( obj, callback )
toggle_node : function ( obj )
This function converts inserted nodes to the required by jsTree format.
clean_node : function ( obj )
This function scrolls the container to the desired node (if needed).
scroll_to_node : function ( obj )
This function returns the current state of the tree (as collected from all active plugins).
get_state : function ()
This function returns the title of the node.
get_text : function ( obj, remove_html )
This function returns a jQuery node after parsing a JSON object (a LI node for single elements or an UL node for multiple).
parse_json : function ( node )
This function returns the whole tree (or a single node) in JSON format.
get_json : function ( obj, is_callback )
This function checks if a structure modification is valid.
check : function ( chk, obj, par, pos )