jQuery UI Widgets Forums Navigation Tree My treeview does not show up using getRecordsHeirarchy

This topic contains 2 replies, has 2 voices, and was last updated by  bobsov 10 years, 4 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author

  • bobsov
    Member

    [
    {
    “name1”: “4481”,
    “name2”: “AH1RS”,
    “name3”: “DISP”
    },
    {
    “name1”: “M4487A”,
    “name2”: “AH7”,
    “name3”: “HSP14 SETBK”
    },
    {
    “name1”: “M4487A”,
    “name2”: “AH7”,
    “name3”: “CSP16 SETBK”
    },
    {
    “name1”: “M4487A”,
    “name2”: “AH7”,
    “name3”: “HSP16 SETBK”
    }
    ]

    var records = dataAdapter.getRecordsHierarchy(‘name1’, ‘name2’, null, [{ name: ‘name1’, map: ‘label’}]);

    I would like to make name1 my id field and name2 my parentId field. But this does not work. I am getting null for “records”. Do id and parentId always have to be integers?


    Dimitar
    Participant

    Hello bobsov,

    Id and parentid can be any string. However, they cannot be mapped to another datafield and should always be called “id” and “parentid”. Here is an example:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/gettheme.js"></script>
    <script type="text/javascript" src="../../scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxcore.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxdata.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxbuttons.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxscrollbar.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxpanel.js"></script>
    <script type="text/javascript" src="../../jqwidgets/jqxtree.js"></script>
    </head>
    <body>
    <div id='content'>
    <script type="text/javascript">
    $(document).ready(function () {
    var theme = "";
    var data = [
    {
    "id": "4481",
    "parentid": "-1",
    "name3": "DISP"
    },
    {
    "id": "M4487A",
    "parentid": "4481",
    "name3": "HSP14 SETBK"
    },
    {
    "id": "M4487B",
    "parentid": "4481",
    "name3": "CSP16 SETBK"
    },
    {
    "id": "M4487C",
    "parentid": "M4487A",
    "name3": "HSP16 SETBK"
    }];
    // prepare the data
    var source =
    {
    datatype: "json",
    datafields: [
    { name: 'id' },
    { name: 'parentid' },
    { name: 'name3' }
    ],
    id: 'id',
    localdata: data
    };
    // create data adapter.
    var dataAdapter = new $.jqx.dataAdapter(source);
    // perform Data Binding.
    dataAdapter.dataBind();
    // get the tree items. The first parameter is the item's id. The second parameter is the parent item's id. The 'items' parameter represents
    // the sub items collection name. Each jqxTree item has a 'label' property, but in the JSON data, we have a 'text' field. The last parameter
    // specifies the mapping between the 'text' and 'label' fields.
    var records = dataAdapter.getRecordsHierarchy('id', 'parentid', 'items', [{ name: 'name3', map: 'label'}]);
    $('#jqxWidget').jqxTree({ source: records, width: '300px', theme: theme });
    });
    </script>
    <div id='jqxWidget'>
    </div>
    </div>
    </body>
    </html>

    Best Regards,
    Dimitar

    jQWidgets team
    http://www.jqwidgets.com/


    bobsov
    Member

    Never thought of that. That may solve my issue. I am loving it.

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.