Selecting a treeview item by it's data properties

1 posts, 0 answers
  1. Rob
    Rob avatar
    4 posts
    Member since:
    Aug 2012

    Posted 10 Aug 2012 Link to this post

    Hi folks,

    I'm using a treeview from a HierarchicalDataSource and wanted to be able to get the element from the treeview if it matched all the properties that I specified. My initial data looked something like this:

        items: [{
        }, {
            moo: true

    I wanted to be able to get the list item element (<li>) for any particular item so I built a function to do it and thought I'd share. You can use my function like this (in this example I want to get the element for the item with the id '3202':

    var liElement = $('#treeView').data('kendoTreeView').search({id:'3202'});

    You can also search on multiple properties:

    var liElement = $('#treeView').data('kendoTreeView').search({id:'1234', moo: true});

    To enable this functionality, after creating a treeview with a HierarchicalDataSource, add this code (assumes your treeview element is #treeView - change as required):

    $("#scenegraph-treeview").data('kendoTreeView').search = function (json, source) {
        if (json !== undefined) {
            var data = source || this.dataSource,
                child, item, i, k, match, allMatched;
            // If the data has the properties we need
            if (data && data._data) {
                child = data._data;
                // If the array has items
                if (child.length) {
                    // Loop the array items
                    for (i = 0; i < child.length; i++) {
                        item = child[i];
                        console.log('Checking child ' + i + ' id ' +;
                        // Check each json property against the current item's properties
                        // and if they all match, grab the tree item based on it's UID
                        allMatched = true;
                        for (k in json) {
                            if (json.hasOwnProperty(k)) {
                                if (item[k] !== json[k]) {
                                    // The item doesn't have all the properties
                                    // that the json object does
                                    allMatched = false;
                        if (allMatched) {
                            // We've found a match, grab the tree item from the UID and return it
                            return this.findByUid(item.uid);
                        } else {
                            // We didn't find what we were looking for so search the children
                            if (item.children) {
                                match =, item.children);
                                if (match) {
                                    return match;

    Hope this helps someone out!

    Rob - Irrelon Software Limited
Back to Top