Get json file from remote server and display in a page

2 posts, 0 answers
  1. guyjoong
    guyjoong avatar
    1 posts
    Member since:
    Feb 2016

    Posted 29 Feb Link to this post

    I have below JSON file stored on remote server "server\test.json":

    {
        "ABC1": [
            {
                "field": "value",
                "field": "value",
                "field": "value"
            },
            {
                "field": "value",
                "field": "value",
                "field": "value"
            }
        ],
        "ABC2": {
            "field": "value",
            "field": "value"
        },
        "ABC3": [
            {
                "field": "value",
                "field": "value",
                "field": "value",
                "XYZ1": {
                    "field": "value",
                    "field": "value",
                    "field": "value"
                },
                "field": "value"
            },
        ]
    }

     

    I am trying to get this json file and render it's contains using Kendo + AngularJS.
    I have tried below method to get the file:

    this.detailsData = new kendo.data.DataSource(
    {
    schema: {
        parse: function(response)
        {
            console.log(JSON.stringify(response));
            return JSON.parse(products);
        }
      
        // Also How to define schema for this json?  
      
    },
    transport:
    {
        read:
        {
            type: "GET",
            dataType: "json",
            url: "server/test.json"
        }
    },
    change: function (data)
    {
        alert("Success :"+data);
    },
    error: function (xhr, error)
    {
        alert("Error");
        console.debug(xhr);
        console.debug(error);
    }
    });

    I am calling "this.detailsData.read();" on some events.
    I am able to get the file, in the parse and also able to print the json data in console logs.
    But when I do "this.detailsData._data" then it is empty.

    I am using "kendo-mobile-conten" and "kendo-mobile-view" in HTML for now, but I am targeting to display it in proper list.

  2. Petyo
    Admin
    Petyo avatar
    2439 posts

    Posted 02 Mar Link to this post

    Hello,

    in general, the datasource is designed to work with an array of objects - your structure is not suitable for such parsing. I may suggest that you load the file with a regular ajax call and transform it manually to an array of some sort. From there on, you can bind any kendo widget to that array.

    Regards,
    Petyo
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
Back to Top