carloss medranoo carloss medranoo - 1 year ago 290
Javascript Question

Change icon on click jstree

I have this code using jstree plugin.

$(".gems-tree").on('changed.jstree' , function( event , data ){
console.log("folder clicked");

And it works, but now i want to change the icon from the folder to close to open, is there a way to achive this?


Already try with
data.node.state.opened = true
just to see if the folder icon change but not.

Answer Source

If you need to change the icon of each selected node, the answer by Adnan Y will work (just make sure data.action is "select_node"):

$("#jstree2").on('changed.jstree', function(evt, data) {
  if(data.action === "select_node") {
    data.instance.set_icon(data.node, '');

If you need to react on nodes opening and closing, use similar code:

  .on('open_node.jstree', function(evt, data) {
    data.instance.set_icon(data.node, '');
  .on('close_node.jstree', function(evt, data) {
    data.instance.set_icon(data.node, true);

In the second example the icon is set to true - this will restore it to the default icon (if this is what you need).

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download