kendo treeview change node
by lhoeppner
HTML
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.default.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.3.1119/styles/kendo.mobile.all.min.css">
<div id="treeview"></div>
<button id='change'>serialize and collapse all</button>
<button id='change2'>deserialize and expand</button>
JavaScript
var inlineDefault = new kendo.data.HierarchicalDataSource({
data: [{
text: "Furniture",
items: [{
text: "Tables & Chairs"
}, {
text: "Sofas",
items: [{
text: "Oranges",
items: [{
text: "Grapes"
}, {
text: "Potato"
}]
}, {
text: "Kiwis"
}]
}, {
text: "Occasional Furniture"
}]
}, {
text: "Decor",
items: [{
text: "Bananas"
}, {
text: "Bed Linen"
}, {
text: "Curtains & Blinds"
}, {
text: "Carpets"
}]
}]
});
var tree = $("#treeview").kendoTreeView({
dataSource: inlineDefault,
loadOnDemand: false
}).data("kendoTreeView");
var serialized;
$("#change").click(function () {
serialized = "";
var expandedNodes = $("#treeview").find(".k-item").filter(function () {
return $(this).attr("data-expanded") === "true";
});
console.log(expandedNodes);
$(expandedNodes).each(function () {
serialized += tree.text(this) + "|";
});
if (serialized.length) {
serialized = serialized.substr(0, serialized.length - 1);
console.log(serialized);
}
tree.collapse(".k-item");
});
$("#change2").click(function () {
var deserialized = serialized.split("|");
$(deserialized).each(function () {
var node = tree.findByText(this);
console.log(node);
tree.expand(node);
});
});