This is a migrated thread and some comments may be shown as answers.

How to create multi-child datasource?

4 Answers 307 Views
Hierarchical Data Source
This is a migrated thread and some comments may be shown as answers.
PetonUser
Top achievements
Rank 1
PetonUser asked on 17 Nov 2017, 10:56 AM

I have datasource for geoJson data collection
var remoteDataSourse = new kendo.data.DataSource({
                type: "odata-v4",
                transport: {
                    read: {
                        url: "/_api/web/lists/getByTitle('Status_Of_Progress')/items?$filter=Enabled eq 1&$top=10000",
                    }
                },
                schema: {
                     data: function (data) {
                        return data;
                     },
                    parse: function(data){
                        
                        let items = data && data.value ? data.value : [data];
                        items = items.map(function(item){
                            if (item.geojson !== null){
                                let el = JSON.parse(item.geojson);                                
                                if(el.type === "FeatureCollection") {
                                    el = el.features[0];
                                } 
                                el.properties.data = item;
                                return el;
                            } else {

                            }
                        });
                        return items;
                    }
                },
                pageSize: 10000
            });

also i have child lists with additional data
/_api/web/getFolderByServerRelativeUrl('/clng/Status_Of_Progress_Images/ITEMS_CODE')/files?$orderby=TimeLastModified desc
/_api/web/lists/getByTitle('Status_Of_Progress_PIR')/items?$filter=CodeId eq 'ITEMS_ID'&$orderby=Planned asc
/_api/web/lists/getByTitle('Status_Of_Progress_CIW')/items?$filter=CodeId eq 'ITEMS_ID'&$orderby=Planned asc
/_api/web/lists/getByTitle('Status_Of_Progress_Procurement')/items?$filter=CodeId eq 'ITEMS_ID'&$orderby=Planned asc

How i can create Hierarchical Data Source for this?

4 Answers, 1 is accepted

Sort by
0
PetonUser
Top achievements
Rank 1
answered on 17 Nov 2017, 11:17 AM
illustration
0
Konstantin Dikov
Telerik team
answered on 21 Nov 2017, 10:23 AM
Hi,

For hierarchical data you could use the HierarchicalDataSource or the TreeListDataSource. Following you could find more information on both dataSource widgets:
Hope this helps.


Regards,
Konstantin Dikov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
PetonUser
Top achievements
Rank 1
answered on 21 Nov 2017, 12:44 PM

like this?

var Status_Of_Progress_Images = {
    type: "odata-v4",
    transport: {
        read: {
            url: function(options) {
                return kendo.format("/_api/web/getFolderByServerRelativeUrl('/clng/Status_Of_Progress_Images/{0}')/files?$orderby=TimeLastModified desc", options.Code);
            }
        }
    },
    schema: {
        model: {
            hasChildren: function() {
                return false;
            }
        }
    }
},
Status_Of_Progress_PIR = {
    type: "odata-v4",
    transport: {
        read: {
            url: function(options) {
                return kendo.format("/_api/web/lists/getByTitle('Status_Of_Progress_PIR')/items?$filter=CodeId eq '{0}'&$orderby=Planned asc", options.Id);
            }
        }
    },
    schema: {
        model: {
            hasChildren: function() {
                return false;
            }
        }
    }
},
Status_Of_Progress_CIW = {
    type: "odata-v4",
    transport: {
        read: {
            url: function(options) {
                return kendo.format("/_api/web/lists/getByTitle('Status_Of_Progress_CIW')/items?$filter=CodeId eq '{0}'&$orderby=Planned asc", options.Id);
            }
        }
    },
    schema: {
        model: {
            hasChildren: function() {
                return false;
            }
        }
    }
},
Status_Of_Progress_Procurement = {
    type: "odata-v4",
    transport: {
        read: {
            url: function(options) {
                return kendo.format("/_api/web/lists/getByTitle('Status_Of_Progress_Procurement')/items?$filter=CodeId eq '{0}'&$orderby=Planned asc", options.Id);
            }
        }
    },
    schema: {
        model: {
            hasChildren: function() {
                return false;
            }
        }
    }
};
var remoteHierarchicalDataSourse = new kendo.data.HierarchicalDataSource({
            type: "odata-v4",
            transport: {
                read: {
                    url: "/_api/web/lists/getByTitle('Status_Of_Progress')/items?$filter=Enabled%20eq%201&$top=10000"
                }
            },
            schema: {
                model: {
                    id: "Id",
                    hasChildren: true,
                    children: Status_Of_Progress_Images,
                    children1: Status_Of_Progress_PIR,
                    children2: Status_Of_Progress_CIW,
                    children3: Status_Of_Progress_Procurement
                }
            }
        });

0
Konstantin Dikov
Telerik team
answered on 23 Nov 2017, 09:00 AM
Hello,

The children property could be only one and it should point to a collection holding the child records. If the additional data will not be hierarchical, you can try to use the DataSource widget, where each collection with the additional data could be a property of the main model:
data:[
   {id: 1, list1: [{ someFIeld: value}], list2: [{..},{.}]},
   {id: 2, list1: [{ someFIeld: value}], list2: [{..},{.}]},
]

However, with the above approach you will have to retrieve the entire data manually, before you pass it to the DataSource`s data.


Regards,
Konstantin Dikov
Progress Telerik
Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Hierarchical Data Source
Asked by
PetonUser
Top achievements
Rank 1
Answers by
PetonUser
Top achievements
Rank 1
Konstantin Dikov
Telerik team
Share this question
or