PDA

View Full Version : Retrieving nested JSON data



claybanks1989
28 Feb 2014, 12:58 PM
Let's start off with my store:


var newstore = Ext.create('Ext.data.Store', {
fields: ['id', 'table_name', 'name', 'description']
proxy: {
type: 'memory'
}
});

I have some example data here, which comes from a dynamic json response:


{
"elements":[
{
"element":{
"name":"Element Name", <---- This is the value I need**
"id":"Element ID",
"attributes":[
{
"attrname":"id",
"attrvalue":"This is the ID"
},
{
"attrname":"name",
"attrvalue":"This is the name"
},
{
"attrname":"description",
"attrvalue":"This is the description"
},
{
"attrname":"table_name",
"attrvalue":"This is the table"
}
]
}
}
}

And I decode my json here, which places it neatly into my store:


for( var i=0; i < decoded.elements.length; i++ ) {
var element = decoded.elements[ i ].element;
var element_name = element.name; <---- THIS retrieves that value I need
var model = {};
// loop over attributes
for( var x=0; x < element.attributes.length; x++ ) {
var attribute = element.attributes[ x ];
model[ attribute.attrname ] = attribute.attrvalue;
}
// implicitly cast data as Model
newstore.add( model );
}

And lastly, my grid - `ResponseList.js`:


var grid = Ext.define('MyApp.view.ResponseList' ,{
initComponent: function(columns) {
//config
this.columns = [
{header: 'Element Name', dataIndex: 'What goes here ???'},
{header: 'ID', dataIndex: 'id'},
{header: 'View Name', dataIndex: 'name'},
{header: 'Description', dataIndex: 'description'},
{header: 'Table Name', dataIndex: 'table_name'},
etc...

My question is, how do I place that first name value, Element Name into the first row of my grid? The name name is already taken for the `attributes.attrname` field, so I'm not sure how to proceed. Everything except Element Name displays just fine.

This is how I want my grid to look:
http://i.stack.imgur.com/OBRgG.png

Any help is appreciated thanks!

Gary Schlosberg
4 Mar 2014, 6:07 PM
Must we assume that you don't have access to changing the source JSON?