tree from json v2
by VadimMalkov
HTML
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.3.1026/styles/kendo.silver.min.css">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2017.3.1026/js/kendo.all.min.js"></script>
<div id='form'>
<input class='k-textbox' data-bind='events:{change:findJ}'>
<br>
<div id='tree' data-role='treeview' data-bind='source:q, events:{select:sel}' data-load-on-demand='true' style='height:500px; width:400px; display: inline-block;'></div>
<textarea class='k-textbox' data-bind='value:selJ, events:{change:changeJ}' wrap='off' style='height:500px; width:400px; display: inline-block;vertical-align:top;'></textarea>
</div>
JavaScript
var k = [{
"text": "Таблицы",
"url": "2",
"spriteCssClass": "k-icon k-i-calculator",
"items": [{
"text": "Справочники",
"items": [{
"text": "Классы",
"url": "table_class"
}, {
"text": "Атрибуты",
"url": "table_attr"
}, {
"text": "Значения атрибутов",
"url": "table_val"
}, {
"text": "Нормализованные материалы с историческими данными",
"url": "table_mtrnormhist"
}, {
"text": "Справочник экспертов",
"url": "table_exp"
}]
}]
}, {
"text": "1_class",
"url": "1_class",
"start": true
}, {
"text": "2_norm",
"url": "2_norm"
}, {
"text": "1_class_exp",
"url": "1_class_exp"
}, {
"text": "2_norm_exp",
"url": "2_norm_exp"
}, {
"text": "stats",
"url": "stats"
}, {
"text": "Управление экспертами prod",
"spriteCssClass": "k-icon k-i-tell-a-friend",
"url": "manage_exp"
}, {
"text": "Иностранный эксперт prod",
"spriteCssClass": "z-icon k-ios7-tiles-a-fill",
"url": "classify_en",
"start": true
}, {
"text": "1_class_prod",
"url": "1_class_prod"
}, {
"text": "2_norm_prod",
"url": "2_norm_prod"
}, {
"text": "1_class_exp_prod",
"url": "1_class_exp_prod"
}, {
"text": "2_norm_exp_prod",
"url": "2_norm_exp_prod"
}];
var j = {
form: {
type: 1,
c: "22",
text: "124124",
items: [
[{
p: "0"
}, "1"],
[4, "5", 6], 2, 3
],
bb: true,
qq: {
type: 1,
c: "22",
text: "124124",
items: [1, 2, 3]
}
}
};
var cnt = 0;
function readNode(obj) {
var r = [];
for (x in obj) {
var d;
if (Array.isArray(obj[x]))
d = {
text: x + ": " + JSON.stringify(obj[x]).substring(0, 30) + "...",
pref: x + ": ",
j: JSON.stringify(obj[x], null, 4),
//obj: obj[x],
idx: cnt++,
child: true
};
else
if (typeof obj[x] === 'object')
d = {
text: x + ": " + JSON.stringify(obj[x]).substring(0, 30) + "...",
...