JSON Data

To bind the TreeList to data in the JSON format, assign a URL leading to data to the dataSource option.

jQuery
JavaScript
$(function() {
    $("#treeListContainer").dxTreeList({
        dataSource: "https://jsonplaceholder.typicode.com/posts"
    });
});
Angular
HTML
<dx-tree-list
    dataSource="http://www.example.com/dataservices/data.json">
</dx-tree-list>

Note that you can also use a JSONP callback parameter supported by jQuery.ajax().

jQuery
JavaScript
$(function() {
    $("#treeListContainer").dxTreeList({
        dataSource: "http://www.example.com/dataservices/jsonpdata?callback=?"
    });
});
Angular
HTML
<dx-tree-list
    dataSource="http://www.example.com/dataservices/jsonpdata?callback=?">
</dx-tree-list>

If you need to process data after obtaining it, implement the CustomStore. For details, see the Custom Sources topic.

See Also