This is a migrated thread and some comments may be shown as answers.

Selecting a treeview item by it's data properties

0 Answers 178 Views
TreeView
This is a migrated thread and some comments may be shown as answers.
Rob
Top achievements
Rank 1
Rob asked on 10 Aug 2012, 09:26 PM
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:

[{
    id:'2022',
    text:'Folder1',
    items: [{
        id:'3202',
        text:'Sub-Folder1'
    }, {
        id:'1234',
        text:'Sub-Folder2',
        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 ' + item.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;
                                break;
                            }
                        }
                    }
 
                    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 = this.search(json, item.children);
                            if (match) {
                                return match;
                            }
                        }
                    }
                }
            }
        }
    }
};

Hope this helps someone out!

Rob - Irrelon Software Limited

No answers yet. Maybe you can help?

Tags
TreeView
Asked by
Rob
Top achievements
Rank 1
Share this question
or