Access icons in 32px.png file?

[Slim Slam]

I'm using the default Jstree 3.0 theme. I see in the file 32px.png, that there are various icons.

When someone clicks on a node, I'd like to change the icon from the default folder icon to

the checkmark icon that is in the 32px.png file.  Is there an example somewhere of how to

do that?

J

[Ivan Bozhanov]

Well it is a sprite, so basically - add a rule like:
.jstree-clicked > .jstree-themeicon { background-position:0px 0px !important; }
Just change the zeros to the actual icon you want to use - left and top offset (so if the icon starts 5 pixels from the left edge and 20px from the top edge of the sprite use: -5px -20px; (notice the minus in front of the value)

Best regards,
Ivan

[Slim Slam]

Hi Ivan,

  That makes sense. But I want to be able to apply that change dynamically. I don't always want

clicked nodes to show a checkmark. I want to be able to set an individual node icon dynamically

via Jquery. Is there a JStree API call for that?

J

[Ivan Bozhanov]

http://www.jstree.com/api/#/?q=sert_icon&f=set_icon%28obj,%20icon%29

Basically you need to get a reference to an instance and call set_icon with the node id as first parameter, and the icon as second. In your case it would be easiest to add classes for that in your CSS like:
.mycustomicon { background:url(path/to/sprite/image.png) 0px 0px no-repeat !important; }
.myothercustomicon { background:url(path/to/sprite/image.png) 0px 0px no-repeat !important; }
And then call:
$('#mytree').jstree(true).set_icon("mynodeid","mycustomicon");

Best regards,
Ivan

[Slim Slam]

Thanks Ivan!