tree from json
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:300px; width:400px; display: inline-block;'></div>
<textarea class='k-textbox' data-bind='value:selJ, events:{change:changeJ}' wrap='off'
style='height:300px; width:400px; display: inline-block;vertical-align:top;'
></textarea>
</div>
JavaScript
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],
id:cnt++,
hasChildren: true
};
else
if (typeof obj[x] === 'object')
d = {
text: x + ": " + JSON.stringify(obj[x]).substring(0, 30) + "...",
pref: x + ": ",
j: JSON.stringify(obj[x],null,4),
obj: obj[x],
id: cnt++,
hasChildren: true
};
else
d = {
text: x + ": " + JSON.stringify(obj[x]),
pref: x + ": ",
j: JSON.stringify(obj[x]),
id: cnt++,
hasChildren: false
};
r.push(d);
}
console.log(r);
return r;
}
function convertNode(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],
id:cnt++
};
else
if (typeof obj[x] === 'object')
d = {
text: x + ": " + JSON.stringify(obj[x]).substring(0, 30) + "...",
pref: x + ": ",
j: JSON.stringify(obj[x],null,4),
obj: obj[x],
id: cnt++
};
else
d = {
text: x + ": " + JSON.stringify(obj[x]),
pref: x + ": ",
j: JSON.stringify(obj[x]),
id: cnt++
};
r.push(d);
}
return r;
}
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":...