1. #1
    Sencha User
    Join Date
    May 2012
    Posts
    3
    Vote Rating
    0
    barun17 is on a distinguished road

      0  

    Default Unanswered: How do I construct a GRID using JSON, which JSON not having datas in one root.

    Unanswered: How do I construct a GRID using JSON, which JSON not having datas in one root.


    I need to construct a grid using JSON, But the data are not in a single root.

    I can able to map data in single root. But i am not able to display/map other datas(EmployeeId & EmployeeName).

    Grid columns are,
    • EmployeeId
    • EmployeeName
    • WebSite
    • Year of Joining
    • Contact Number
    • Geo Location
    • Extension
    JSON:
    (FileName : empdetails.json)
    {
    "EmployeeSummary": [
    {
    "EmployeeId": "1234",
    "EmployeeName": "Arun",
    "SuccessId": true,
    "EmployeeDetails": [
    {
    "Label": "WebSite",
    "Value": "http://www.arun.com"
    },
    {
    "Label": "Year Of Joining",
    "Value": "2000"
    },
    {
    "Label": "Contact Number",
    "Value": "987-654-3210"
    },
    {
    "Label": "Geo Location",
    "Value": "India"
    },
    {
    "Label": "Extension",
    "Value": "457896"
    }
    ]
    }
    ]
    }

    I tried with the below code:
    Ext.require(['Ext.data.*', 'Ext.grid.*']);


    Ext.define('Person', {
    extend: 'Ext.data.Model',
    fields: ['Label', 'Value']
    });


    Ext.onReady(function(){


    var store = Ext.create('Ext.data.Store', {
    autoLoad: true,
    autoSync: true,
    model: 'Person',
    proxy: {
    type: 'rest',
    url: 'data/empdetails.json',
    reader: {
    type: 'json',
    root: 'EmployeeSummary[0].EmployeeDetails'
    },
    writer: {
    type: 'json'
    }
    }
    });

    var rowEditing = Ext.create('Ext.grid.plugin.RowEditing');

    var grid = Ext.create('Ext.grid.Panel', {
    renderTo: document.body,
    plugins: [rowEditing],
    width: 400,
    height: 300,
    frame: true,
    title: 'Sample Grid',
    store: store,
    iconCls: 'icon-user',
    hideHeaders: true,
    columns: [{
    text: 'ID',
    width: 150,
    sortable: true,
    dataIndex: 'Label'
    }, {
    text: 'Email',
    flex: 1,
    sortable: true,
    dataIndex: 'Value',
    field: {
    xtype: 'textfield'
    }
    }]
    });
    });


    I also attached code for more understanding.
    Attached Files

  2. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    9,075
    Answers
    674
    Vote Rating
    467
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    Please see the following:
    http://www.sencha.com/forum/showthread.php?219981

    Regards,
    Scott.

Thread Participants: 1