Please try with the below code snippet.
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<link href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.common.min.css" rel="stylesheet" />
<link href="http://cdn.kendostatic.com/2014.1.318/styles/kendo.default.min.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.1.318/js/kendo.all.min.js"></script>
<script>
// Your Json Data
var jsondata = {
"GetMenu": [
{
"OutletCode": "BOL",
"MenuGroup": [
{
"ParentId": 1,
"ItemName": "BEER",
"Items": [
{
"ItemId": 239,
"ParentId": 1,
"ItemName": "HEINEKEN PINT BEER",
"Price": "35.000"
},
{
"ItemId": 241,
"ParentId": 1,
"ItemName": "HEINEKEN BOTLLE",
"Price": "35.000"
}
]
},
{
"ParentId": 2,
"ItemName": "BREEZERS",
"Items": [
{
"ItemId": 110,
"ParentId": 2,
"ItemName": "BACARDI BREEZER",
"Price": "35.000"
}
]
}
],
}]
};
var testArray = new Array();
var testObject = new Object();
testObject.ItemName = jsondata.GetMenu[0].OutletCode;
testObject.Items = jsondata.GetMenu[0].MenuGroup;
testArray.push(testObject);
$( document ).ready(function() {
var inlineDefault = new kendo.data.HierarchicalDataSource({
data: testArray,
schema: {
model: {
children: "Items"
}
}
});
$("#treeview-left").kendoTreeView({
dataSource: inlineDefault ,
dataTextField: "ItemName",
});
});
</script>
</head>
<body>
<div>
<div id="treeview-left"></div>
</div>
</body>
</html>
http://jsfiddle.net/ivyansh9897/QgV53/1/ Let me know if any concern.