jQuery Tree

Bind to the select event by type: jqxTree. Author: http://jqwidgets.com

by sherin81

HTML

<script src="http://jqwidgets.com/public/jqwidgets/jqx-all.js"></script>
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.base.css">
<link rel="stylesheet" href="http://jqwidgets.com/public/jqwidgets/styles/jqx.energyblue.css">
<div id='jqxTree' style="background-color:green; height:400px;width:600px;">
</div>

JavaScript

var data = [
{
    "text": "Chocolate Beverage",
    "id": "1",
    "parentid": "-1"
}, {
    "id": "2",
    "parentid": "1",
    "text": "Hot Chocolate"
}, {
    "id": "3",
    "parentid": "1",
    "text": "Peppermint Hot Chocolate"
}, {
    "id": "4",
    "parentid": "1",
    "text": "Salted Caramel Hot Chocolate"
}, {
    "id": "5",
    "parentid": "1",
    "text": "White Hot Chocolate"
}, {
    "id": "6",
    "text": "Espresso Beverage",
    "parentid": "-1"
}, {
    "id": "7",
    "parentid": "6",
    "text": "Caffe Americano"
}, {
    "id": "8",
    "text": "Caffe Latte",
    "parentid": "6"
}, {
    "id": "9",
    "text": "Caffe Mocha",
    "parentid": "6"
}, {
    "id": "10",
    "text": "Cappuccino",
    "parentid": "6"
}, {
    "id": "11",
    "text": "Pumpkin Spice Latte",
    "parentid": "6"
}, {
    "id": "12",
    "text": "Frappuccino",
    "parentid": "-1"
}, {
    "id": "13",
    "text": "Caffe Vanilla Frappuccino",
    "parentid": "12"
}, {
    "id": "15",
    "text": "450 calories",
    "parentid": "13"
}, {
    "id": "16",
    "text": "16g fat",
    "parentid": "13"
}, {
    "id": "17",
    "text": "13g protein",
    "parentid": "13"
}, {
    "id": "14",
    "text": "Caffe Vanilla Frappuccino Light",
    "parentid": "12"
}]

  function  run()
    {
      //  alert('Inside buidldata');
        var source = [];
        var items = [];
      // build hierarchical source.
        alert('data length:' + data.length);
        for (i = 0; i < data.length; i++) {
            var item = data[i];
            var label = item["text"];
            var parentid = item["parentid"];
            var id = item["id"];

            if (items[parentid]) {
                var item = { parentid: parentid, label: label, item: item };
                if (!items[parentid].items) {
                    items[parentid].items = [];
                }
                items[parentid].items[items[parentid].items.length] = item;
                items[id] = item;
            }
 ...