How to create multi-child datasource?

5 posts, 0 answers
  1. MaRKTD
    MaRKTD avatar
    4 posts
    Member since:
    Jul 2017

    Posted 17 Nov Link to this post


    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?
  2. MaRKTD
    MaRKTD avatar
    4 posts
    Member since:
    Jul 2017

    Posted 17 Nov Link to this post

    illustration
  3. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2138 posts

    Posted 21 Nov Link to this post

    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.
  4. MaRKTD
    MaRKTD avatar
    4 posts
    Member since:
    Jul 2017

    Posted 21 Nov in reply to Konstantin Dikov Link to this post

    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
                    }
                }
            });

  5. Konstantin Dikov
    Admin
    Konstantin Dikov avatar
    2138 posts

    Posted 23 Nov Link to this post

    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.
Back to Top