3

Let's say I want to add a red background to all tree nodes matching a certain text, in a dynamically loaded Kendo UI TreeView. How can I do this?

It's easy to customize node styles when instantiating trees from HTML, but for trees loaded from a local data source or read from a remote HierarchicalDataSource, there seem to be no way to alter the item's text per-node style:

How can I achieve something like this while loading the tree from JavaScript?

enter image description here

Dan Dascalescu
  • 143,271
  • 52
  • 317
  • 404

1 Answers1

3

Why wouldn't you just use jQuery for it. Like this:

    $("#treeview").kendoTreeView({
        ...
        dataBound: function (e) {
            var text = "Your Text";
            e.sender.element.find("span.k-in:contains(" + text + ")").css('background-color', 'red');
        }
    });

Working example: http://dojo.telerik.com/oxUKI

Jarosław Kończak
  • 3,387
  • 2
  • 19
  • 36
  • Nice. I've glossed over the [Treeview documentation for databound](http://docs.telerik.com/kendo-ui/api/javascript/ui/treeview#events-dataBound) because it didn't mention styling the node at all. The Scheduler doc for databind does mention how to [modify element styling on databound](http://docs.telerik.com/kendo-ui/web/scheduler/how-to/modify-event-styling-on-databound). – Dan Dascalescu Jan 06 '15 at 19:43