PK json parse v1
by VadimMalkov
HTML
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.common.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.silver.min.css">
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2017.1.118/styles/kendo.silver.mobile.min.css">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://kendo.cdn.telerik.com/2017.1.118/js/kendo.all.min.js"></script>
<div id='form' class='form'>
<div data-role='splitter' style='height:600px;' data-panes='[{collapsible: true, resizable: true, size: "30%", scrollable:false}]'>
<div></div>
<div>
<div data-role='tabstrip' data-animation='false' class='tab' style='height:100%;' data-scrollable='{distance: 300}'>
<br>
</div>
</div>
</div>
</div>
<script>
var modelForm = kendo.observable({});
</script>
CSS
#form {
font-size: 13px;
}
.tab {
background-color: transparent;
border: none;
}
.zbox {
margin-top: 2px;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
vertical-align: middle;
}
.k-panelbar {
border-style: none;
}
.k-ghost-splitbar {
z-index: 1;
}
JavaScript
g = {
form: {
items: [{
type: "splitter",
height: 600,
orientation: "horizontal",
items: [{
resizable: true,
size: "30%",
scrollable: false,
items: [{
type: "grid"
}]
}, {
scrollable: true,
items: [{
type: "tabstrip",
height: 600,
items: [{
text: "1",
items: [{
type: "label",
text: "код",
margin: 40,
width: 100
}, {
type: "text",
width: 150,
margin: 4,
exp: "@code"
}, {
type: "br"
}, {
type: "label",
text: "описание",
margin: 40,
width: 100
}]
}]
}]
}]
}]
}
};
m = {
items: [{
splitter: {}
}]
};
//console.log(kendo.stringify(g).replace(/\"/g, "\\\""));
//console.log(g["form"]["items"]["0"]);
var bypath = function(obj, path){
for (var i=0, path=path.split('.'), len=path.length; i<len; i++){
obj = obj[path[i]];
};
return obj;
};
//.hasOwnProperty("items")
console.log(bypath(g,"form.items.0"));
$.each(bypath(g,"form.items.0"), function(v) {console.log(v);});
kendo.bind($("#form"), modelForm);