I am binding to a igTree using JSON binding. I would like to set different colors on individual nodes. For example, the first node is red, the second is blue, the third is green etc. The color is used to indicate a status for the data the node represents. Can someone give me an idea of how to do this, or if it can be done?
I resolved the issue by looping through the nodes and setting the color. Thanks for your help.
Hello again Bill,
I'm just checking did you manage to resolve that? If you have any additional questions I'll be happy to help.
Thanks,
Martin Stoev
Hello Bill,
Yes - there is no "node" property in the "ui" variable, since the "rendered" event if fired just once when the tree is rendered. What you should do is what you proposed - loop through all the nodes and match them with some criteria to the "Color" property of you data. However there is another solution if you are using the "loadOnDemand" setting. If that's true for you, you can use the "nodePopulated" event for coloring the nodes. From that event you can use the "ui.data" object to match to your "Color" property.
You can always refer to the API reference, if you need more information about the options, events and their arguments.
Hope this helps,
Thanks for the reply. Unfortunately, the rendered event does not work in my situation. The Color is a property of the data that I am binding to the tree. Here is what I tried:
rendered: function (evt, ui) {
$("li > a").css("background", ui.node.data.Color);
}
In this event (unlike the nodeClick event) the ui variable does not have a node property, so I don't have access to the data for the individual node. Perhaps I need to loop through all of the nodes in the tree and set the color that way?
I'm checking to see if you need some further assistance on this matter. If there are some questions I might answer, please feel free to ask.