Testing Kendo Data Source filtering

by jhuesos

HTML

<link rel="stylesheet" href="https://dl.dropbox.com/u/1015439/kendo.common.min.css">
<link rel="stylesheet" href="https://dl.dropbox.com/u/1015439/kendo.default.min.css">
<script src=" http://cdn.kendostatic.com/2012.3.1315/js/kendo.all.min.js"></script>
<div id="search-container">
    <label for="filter">Search:</label>
    <input id="filter" />
</div>
<div id="selected-container">Selected Node: <span id="selected-node"></span>

</div>
<div id="tree">TREE</div>

CSS

#search-container {
    color: white;
    background: #333;
    height: 40px;
    line-height: 40px;
    padding: 0 0 0 10px;
}
#tree {
    margin-top: 10px;
}
#tree-copy {
    border-top: 1px solid #999;
    background-color: #ccc;
}
}
.disabled {
    color: #ccc;
}
#selected-container {
    border: 1px solid #ccc;
    min-height: 30px;
    line-height: 30px;
    margin-bottom: 20px;
    text-indent: 10px;
}

#selected-node {
    color: #999;
}

JavaScript

$(function () {
    var data = [{
        title: 'account',
        activated: true,
        items: [{
            title: 'account.node1',
            activated: true,
            items: []
        }, {
            title: 'account.node2',
            activated: true,
            items: [{
                title: 'account.node2.leaf1',
                activated: false,
                items: []
            }, {
                title: 'account.node2.leaf2',
                activated: true,
                items: []
            }]
        }]
    }, {
        title: "device",
        activated: true,
        items: [{
            title: 'device.node1',
            activated: true,
            items: []
        }, {
            title: 'device.node2',
            activated: false,
            items: [{
                title: 'device.node2.leaf1',
                activated: true,
                items: []
            }, {
                title: 'device.node2.leaf2',
                activated: true,
                items: []
            }]
        }]
    }, {
        title: "interaction",
        activated: true,
        items: [{
            title: 'interaction.node1',
            activated: true,
            items: []
        }, {
            title: 'interaction.node2',
            activated: false,
            items: [{
                title: 'interaction.node2.leaf1',
                activated: true,
                items: [{
                    title: 'interaction.node2.leaf1.leaf',
                    activated: true,
                    items: []
                }, {
                    title: 'interaction.node2.leaf2.leaf',
                    activated: true,
                    items: []
                }]
            }, {
                title: 'interaction.node2.leaf2',
                activated: true,
                items: []
            }]
        }]
    }];
    // END DATA

    var ds = new kendo.data.HierarchicalDataSource({
        data: data,
       ...