Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Brian on May 29, 2009 12:24
open dhtmlx forum
Error when loading JSON data to build dhtmlxTree

I have a simple codes below to build a hierarchy tree from a JSON data file. Error appears in dhtmxtree_json.js file. Is there something I missed in my codes or a bug in dhtmlxtree_json extension?

Thanks,
Brian

<html>
<head>
<link rel="stylesheet" type="text/css" href="include/dhtmlxLayout/codebase/dhtmlxlayout.css" />
<link rel="stylesheet" type="text/css" href="include/dhtmlxLayout/codebase/skins/dhtmlxlayout_dhx_black.css">
<script type="text/javascript" src="include/dhtmlxLayout/codebase/dhtmlxlayout.js"></script>
<script type="text/javascript" src="include/dhtmlxLayout/codebase/dhtmlxcommon.js"></script>
<script type="text/javascript" src="include/dhtmlxWindows/codebase/dhtmlxwindows.js"></script>
<script type="text/javascript" src="include/dhtmlxTree/codebase/dhtmlxtree.js"></script>
<script type="text/javascript" src="include/dhtmlxTree/codebase/ext/dhtmlxtree_json.js"></script>

<script>
// setting custom skin
var dhxLayout, tree;
function addOnLoad() {
dhxLayout = new dhtmlXLayoutObject(document.body, "2U", "dhx_black");
dhxLayout.cells("a").setText("Territory Hierarchy");
dhxLayout.cells("b").setText("Details");
dhxLayout.cells("a").setWidth(400);
dhxLayout.cells("b").attachURL("http://www.google.com");

tree = dhxLayout.cells("a").attachTree("0");
tree.setImagePath("include/dhtmlxTree/codebase/imgs/");
tree.setXMLAutoLoading("treedata.json");
tree.setDataMode("json");
//tree.enableSmartXMLParsing(true);
tree.enableDragAndDrop(true);
//tree.enableKeySearch(true);
//tree.enableTreeLines(false);
//tree.enableCheckBoxes(1);
tree.loadJSON("treedata.json");
}
</script>
</head>
<body onload="addOnLoad();">

</body>
</html>

JSON DATA:

{ label: 'name',
identifier: 'name',
items: [
{ name:'Students', type:'cat',
children: [
{ name:'Vinod', type:'st' },
{ name:'Suman', type:'st' },
{ name:'Deepak', type:'st' }
]

},
{ name:'Fruits', type: 'cat',
children: [
{ name:'Apple', type:'fr' },
{ name:'Mango', type:'fr' },
{ name:'Graps', type:'fr',
children: [
{ name:'Sweets', type:'gr' },
{ name:'Sour', type:'gr' },
{ name:'Salt', type:'gr' }
]

}
]

},
{ name:'Vegetables', type: 'cat'},
{ name:'Education', type:'cat'}
]
}
Answer posted by Support on Jun 01, 2009 06:40
JSON data , used in your case, missed "id" property for each item.
Expected JSON data 

{
  items: [
  {
      id:"some1",
  text: 'Students',
  type: 'cat',
  children: [
  {
      id:"some2",
  text: 'Vinod',
  type: 'st'
  },
  {
      id:"some3",
  text: 'Suman',
  type: 'st'
  },
  {
      id:"some4",
  text: 'Deepak',
  type: 'st'
  }
  ]

  }
  ]
}

Answer posted by Brian on Jun 01, 2009 12:09
Hi,

After I added the ID's to the json data file per your suggestion, I got this error: "Error Type: DataStructure. Description: XML reffers to not existing parents"

Thanks,
Brian
Answer posted by Support on Jun 02, 2009 05:14
Working sample attached to email. 
If problem still occurs for you - please provide exact snippet of data, which cause problem in your case ( you can send it directly to support@dhtmlx.com ) 
Attachments (1)
1243945883.zip39.36 Kb