Problems populating a kendo treeview dialog: only root nodes are populated

Question

I'm facing some difficulties when trying to populate a kendo treeview with JSON data. My kendo treeview only displays the root elements and not it's children.

In short I have the following in js:

   var featuremodel = getMetaContentByName("filterJson");

   var featuremodeljson = jQuery.parseJSON(featuremodel);
   console.log(featuremodeljson);

   var local = new kendo.data.HierarchicalDataSource({  
               data: featuremodeljson,  
               schema:{
                    model: {
                        id: "id",
                        children: "items"
                    }
            }

   });


   $("#treeview").kendoTreeView({
        dataSource:  featuremodeljson,
        dataTextField: "FullName",
        checkboxes: true,
        checkboxes: {
            checkChildren: true
          },
        loadOnDemand: false,      
    });

I can see in the console,

   console.log(featuremodeljson) 

that this is a valid Json. I can see the element hierarchy. However, the kendo view only populates the elements in the first hierarchy level - and not their children.

The Json is something like this:

 [{
   "id": "No Feature",
   "FullName": "No Feature",
   "expanded": "true",
   "hasChildren": "true",
   "items": [ {
       "id": "Feature0",
       "FullName": "Feature0",
       "expanded": "true",
       "hasChildren": "true"
     }]
 },
{
   "id": "Sensors",
   "FullName": "Sensors",
   "expanded": "true",
   "hasChildren": "true",
   "items": [{
       "id": "Feature1",
       "FullName": "Feature1",
       "expanded": "true",
       "hasChildren": "true"
  }]
},  
 {
   "id": "Warnings",
   "FullName": "Warnings",
   "expanded": "true",
   "hasChildren": "true",
   "items": [ {
       "id": "Feature2",
       "FullName": "Feature2",
       "expanded": "true",
       "hasChildren": "true"
    }]
  },  
  {
   "id": "Languages",
   "FullName": "Languages",
   "expanded": "true",
   "hasChildren": "true",
   "items": [ {
       "id": "Feature3",
       "FullName": "Feature3",
       "expanded": "true",
       "hasChildren": "true"
  }]
}]

Any ideas of what I'm doing wrong? Thanks

Answer 1

I found the problem - The JSON is not correct. Both "expanded" and "hasChildren" require boolean attributes. Hence, the values are not "true" but true.

The Json should be something like this:

[{
   "id": "No Feature",
   "FullName": "No Feature",
   "expanded": true,
   "hasChildren": true,
   "items": [ {
       "id": "Feature0",
       "FullName": "Feature0",
       "expanded": true,
       "hasChildren": true
     }]
 },
{
   "id": "Sensors",
   "FullName": "Sensors",
   "expanded": true,
   "hasChildren": true,
   "items": [{
       "id": "Feature1",
       "FullName": "Feature1",
       "expanded": true,
       "hasChildren": true
  }]
}]