In a tree built with jsTree, I have the text within the <a> tag sitting in a variable. I would like to check that node. How can I do so?

I am currently finding that node, using jQuery, and altering its class. However, this does not repair the parent node by making the parent undetermined in its class. I tried doing $('.colors').jstree("checkbox_repair"), but that didn't seem to do anything.

It would be great if someone could actually answer both those questions, since they are related to the same problem.

Here is a jsFiddle, illustrating the issue--> /

In a tree built with jsTree, I have the text within the <a> tag sitting in a variable. I would like to check that node. How can I do so?

I am currently finding that node, using jQuery, and altering its class. However, this does not repair the parent node by making the parent undetermined in its class. I tried doing $('.colors').jstree("checkbox_repair"), but that didn't seem to do anything.

It would be great if someone could actually answer both those questions, since they are related to the same problem.

Here is a jsFiddle, illustrating the issue--> http://jsfiddle.net/thapar/5XAjU/

• javascript
• jquery
• jstree

• put the code here: jsfiddle.net – Ram Commented Apr 7, 2012 at 11:00

4 Answers 4

In js_tree there are .check_node ( node ) and .uncheck_node ( node ) functions, i think this is what you are asking for. Soe the documentation here: http://www.jstree.com/documentation/checkbox

This is an excerpt from the documentation in the link above, "how to perform an operation":

/* METHOD ONE */
jQuery("some-selector-to-container-node-here")
    .jstree("operation_name" [, argument_1, argument_2, ...]);

/* METHOD TWO */
jQuery.jstree._reference(needle)
    /* NEEDLE can be a DOM node or selector for the container or a node within the container */
    .operation_name([ argument_1, argument_2, ...]);

So I think this syntax should work

$.jstree._reference(".colors").check_node('li#tree_3');

Also i am not sure you should be using a class to reference your tree. Probably use an ID to reference your tree, and then use this syntax:

$.jstree._reference("#colors").check_node('li#tree_3');

//EDIT: Please keep in mind that the newest version of jsTree doesn't have a function called _reference anymore. It got renamed to reference (without the leading underscore). (Last checked 24/08/2015 15:45 by @mkli90) Link: https://www.jstree.com/api/#/?f=$.jstree.reference(needle)

If you want to check jsTree nodes on load for example like this:

$(document).ready(function()
{
  $.jstree._reference('#menu').check_node('#pih2');
});

it does not work. For me works following:

$(function () {
    $('#mainMenu1').bind('loaded.jstree', function(e, data){ //waiting for loading
          $.jstree._reference('#menu').check_node('#pih2');  //check node with id pih2
        $.jstree._reference('#menu').check_node('#pih6');  //check node with id pih6
  }); 
});

I use jsTree 1.0-rc3 and JQuery 1.7.1. Aloe

In current versions of jstree the following syntax works:

$("#my_tree").jstree("check_node", node_id);

I would like to add this solution, the select_node function does the same function as check_node. we can use it as follows;

$('#jstree_id').on('loaded.jstree', function() {
    $("#jstree_id").jstree("select_node", ["list of nodes go here"]);
});

You can use it to select multiple nodes in an array or a single node.