Datasource issue when getting JSON Adjacency List

4 posts, 0 answers
  1. axwack
    axwack avatar
    37 posts
    Member since:
    Aug 2012

    Posted 20 Jan Link to this post

    I have data stored for the Treelist as an adjacency list in the database. I call the data using JSON and then, per the instructions in the documentation, I use the schema.parse function to then convert a nested JSON to a flat array. 

    The first value comes out and displays in the tree. When I click to get the child, nothing shows. The object structure is the same as the parent.

     Here is the code:

    JSON OF PARENT

    {"id": 26, "tgtWeight": 0.0, "currWeight": 0.0, "hasChildnode": true, "ext_model_id": 8, "parent": null, "SSM": {"id": 8, "securitySelectionModelName": "ssm8", "userCreatedModel": "[{\"classificationName\":\"ssm8\",\"id\":8,\"hasChildNode\":true,\"child\":[{\"classificationName\":\"MBS\",\"id\":14,\"hasChildNode\":true,\"child\":[{\"classificationName\":\"Common Stock\",\"id\":15,\"hasChildNode\":false}]}]}]", "classificationNames": []}, "classificationNameNode": null}

     JSON OF CHILD


    [{"id": 27, "tgtWeight": 0.0, "currWeight": 0.0, "hasChildnode": true, "ext_model_id": 14, "parent": {"id": 26, "tgtWeight": 0.0, "currWeight": 0.0, "hasChildnode": true, "ext_model_id": 8, "parent": null, "SSM": 8, "classificationNameNode": null}, "SSM": {"id": 8, "securitySelectionModelName": "ssm8", "userCreatedModel": "[{\"classificationName\":\"ssm8\",\"id\":8,\"hasChildNode\":true,\"child\":[{\"classificationName\":\"MBS\",\"id\":14,\"hasChildNode\":true,\"child\":[{\"classificationName\":\"Common Stock\",\"id\":15,\"hasChildNode\":false}]}]}]", "classificationNames": []}, "classificationNameNode": {"id": 14, "classificationLevel": 2, "classificationName": "MBS", "hasChildNode": false, "parent": 2}}]

    These get converted into a JAVASCRIPT OBJECT in the schema.parse.

     

    JAVASCRIPT

    01.$(document).ready(function () {
    02.    var id = {{ id }};
    03. 
    04.    var dataSource = new kendo.data.TreeListDataSource({
    05.        transport: {
    06.            read: {
    07.                url: "../getModelTargetWeights?SSM_id="+id,
    08.                dataType: "json"
    09.            }
    10.        },
    11.        schema: {
    12.            parse: function(response) {
    13.                NodeArray=[];
    14.                if (response.length == undefined) {
    15. 
    16.                var node = {
    17.                    id: response.id,
    18.                    currWeight: response.currWeight,
    19.                    tgtWeight: response.tgtWeight,
    20.                    hasChildren: response.hasChildnode,
    21.                    parentId: response.parent,
    22.                    ext_model_id: response.ext_model_id,
    23.                    securitySelectionModelName: response.SSM.securitySelectionModelName,
    24.                    classificationNameNode: response.classificationNameNode
    25.                };
    26.                     NodeArray.push(node);
    27.            } else {
    28.                    for (var i=0; i < response.length; i++){
    29.                        var node = {
    30.                            id: response[i].id,
    31.                            currWeight: response[i].currWeight,
    32.                            tgtWeight: response[i].tgtWeight,
    33.                            hasChildren: response[i].hasChildnode,
    34.                            parentId: response[i].parent.ext_model_id,
    35.                            ext_model_id: response[i].ext_model_id,
    36.                            securitySelectionModelName: response[i].SSM.securitySelectionModelName,
    37.                            classificationNameNode: response[i].classificationNameNode.classificationName
    38.                        }
    39.                        NodeArray.push(node);
    40.                    }
    41.            }
    42. 
    43.                return NodeArray;
    44.           },
    45.           model: {
    46.                id: "id",
    47.                parentId: "parentId",
    48.                fields: {
    49.                           parentId: { field: "parentId", nullable: true },
    50.                           securitySelectionModelName: "securitySelectionModelName",
    51.                           classificationNameNode: "classificationNameNode",
    52.                           tgtWeight: { field: "tgtWeight", nullable: true },
    53.                           hasChildren: { type: "boolean", field: "hasChildren" }
    54.                }
    55.            }
    56.         }
    57.    });
    58. 
    59.   $("#treeList").kendoTreeList({
    60.        dataSource: dataSource,
    61.        editable: true,
    62.        height: 540,
    63.        columns: [
    64.                    { field: "securitySelectionModelName", title: "Model Name" },
    65.                    { field: "classificationNameNode", title: "Classification" },
    66.                    { field: "tgtWeight", title: "Target" }
    67.         ],
    68.   });
    69.     dataSource.read();
    70.    });
    71.</script>

     

     

  2. axwack
    axwack avatar
    37 posts
    Member since:
    Aug 2012

    Posted 20 Jan Link to this post

    THIS IS THE NEWER CODE 
     
     
    $(document).ready(function () {
            var id = {{ id }};
     
            var dataSource = new kendo.data.TreeListDataSource({
                transport: {
                    read: {
                        url: "../getModelTargetWeights?SSM_id="+id,
                        dataType: "json"
                    }
                },
                schema: {
                    parse: function(response) {
                        NodeArray=[];
                        if (response.length == undefined) {
     
                            var node = {
                                id: response.id,
                                currWeight: response.currWeight,
                                tgtWeight: response.tgtWeight,
                                hasChildren: response.hasChildnode,
                                parentId: response.parent,
                                ext_model_id: response.ext_model_id,
                                securitySelectionModelName: response.SSM.securitySelectionModelName,
                                classificationNameNode: response.classificationNameNode,
     
                            };
                             NodeArray.push(node);
                        } else {
                                for (var i=0; i < response.length; i++){
                                    var node = {
                                        id: response[i].id,
                                        currWeight: response[i].currWeight,
                                        tgtWeight: response[i].tgtWeight,
                                        hasChildren: response[i].hasChildnode,
                                        parentId: response[i].parent.ext_model_id,
                                        ext_model_id: response[i].ext_model_id,
                                        securitySelectionModelName: response[i].SSM.securitySelectionModelName,
                                        classificationNameNode: response[i].classificationNameNode.classificationName
                                    }
                                    NodeArray.push(node);
                                }
                        }
                            console.log(NodeArray);
                            return NodeArray;
                   },
                    model: {
                        id: "id",
                        parentId: "parentId",
                        hasChildren: false,
                        fields: {
                                   id: { type: "number", nullable: false},
                                   parentId: {  field: "parentId", type:"number", defaultValue: null },
                                   hasChildren: {type: "boolean", field: "hasChildren"}
                        }
                    }
                 }
            });
     
           $("#treeList").kendoTreeList({
                dataSource: dataSource,
                editable: true,
                height: 540,
                editable: true,
                columns: [
                            { field: "securitySelectionModelName", title: "Model Name",expandable: true },
                            { field: "classificationNameNode", title: "Classification" },
                            { field: "tgtWeight", title: "Target" }
                 ],
           });
     
            });
        </script>
    Your quote goes here
  3. Kendo UI is VS 2017 Ready
  4. Nikolay Rusev
    Admin
    Nikolay Rusev avatar
    2285 posts

    Posted 22 Jan Link to this post

    Hello Vincent,

     

    The reason for not showing child items is that the child item, parentId field `parent.ext_model_id` has value of 8 and there isnt' parent item with such id field. 

     

    If I change the above field to 26 it will be rendered in the TreeList as there is such parent.

     

    Example - http://dojo.telerik.com/@rusev/iNiwI

     

    Regards,
    Nikolay Rusev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  5. axwack
    axwack avatar
    37 posts
    Member since:
    Aug 2012

    Posted 22 Jan in reply to Nikolay Rusev Link to this post

    Nikolay, thank you for pointing out that I'm an idiot!! :)

     

Back to Top
Kendo UI is VS 2017 Ready