View ItemName from other Datasources

2 posts, 0 answers
  1. JohnLee
    JohnLee avatar
    1 posts
    Member since:
    Sep 2020

    Posted 01 Oct 2020 Link to this post

    Hi everyone, 

    I'm newbie, I get a stuck when view ItemName in Grid

    I have Datasource about User, Location, DataCode
    dataUser = [

    {

    "CompCode" : "abc",

    "LtnList": "%, 001, 002",

    "DataCode": 5

    },

    {
    "CompCode" : "abc",
    "LtnList": "001, 002",
    "DataCode": 7
    },

    ]

     

    Datasource Location:
    DataLctn = [

    {

    "ITEMCODE" : "%",
    "ITEMNAME" : "All"

    },

    {
    "ITEMCODE" : "001",
    "ITEMNAME" : "Paris"
    },{
    "ITEMCODE" : "002",
    "ITEMNAME" : "NewYork"
    }

    ]

     

    Datasource DataCode

    DataCode = [

    {

    "ITEMCODE" : 1,

    "ITEMNAME" : "Add"

    },

    {
    "ITEMCODE" : 2,
    "ITEMNAME" : "Update"
    },

    {
    "ITEMCODE" : 3,
    "ITEMNAME" : "Delete"
    }

    ]

     

    How to map ItemName from DataCode and DataLctn sothat I show their ItemNames in Grid of DataUser

  2. Neli
    Admin
    Neli avatar
    434 posts

    Posted 05 Oct 2020 Link to this post

    Hi John,

    The Kendo Grid can have only one dataSource. You will need to create a single JavaScript array that contains all the needed information and bind the grid to that array.

    I have prepared a small Dojo example where the dataUser object contains information about the DataCode. In the example, dataSource.schema.model is used in order to be able to render the nested object's data. 

     $("#grid").kendoGrid({
            columns: [   
              { field: "CompCode" },    
              { field: "dataCode_ItemName", title: "Data Code" }
            ],  
            dataSource: {
              data: dataUser,
              schema: {
                model: {
                  id: "id",
                  fields: {
                    id: { type: "number" },
                    dataCode_ItemName: { from: "DataCode.ITEMNAME" }
                  }
                }
              }
            },
          });

    I hope the provided information will be helpful.

    Regards,
    Neli
    Progress Telerik

    Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).

Back to Top