How to parse Json Two-dimensional array in Extjs 6.5.2? - extjs

Question

I want to get all values in a Two-dimensional array and I'm sure I'm doing something in my model config. How can I do that?
Here's the code for my store:
Ext.define('Test.store.PathStore', {
extend: 'Ext.data.Store',
alias: 'store.PathStore',
storeId:'PathStore',
model : 'Test.model.PathModel',
autoSync:true,
proxy: {
type: 'ajax',
url:"url",
method:'GET',
reader: {
type: 'json',
rootProperty : ''
}
}
});
Here's the code for my model:
Ext.define('Test.model.PathModel', {
extend: 'Ext.data.Model',
fields: [
{name:'CID', type:'auto'},
{name:'NAME', type:'auto'},
{name:'DEFAULT_NAME', type:'auto'},
{name:'REPRESENTATIONS', type:'auto'}
]
});
Here's the code for my controller:
onButtonClick: function (selModel, record, index, options) {
var pathStore = Ext.getStore('PathStore');
pathStore.load({
// Some params,
callback: function(records, success, response, options) {
if(success){
var arr = Object.values(records[0].getData().DEFAULT_NAME);
console.log(records);
console.log(arr);
console.log(records[0].getData());
//Something I Have To Do
}
}
scope: this
});
}
Here's the format for my Json:
[
[
{
"CID": 111111,
"NAME": null,
"DEFAULT_NAME": "Hello guys",
"REPRESENTATIONS": null,
"ALL_REPRESENTATIONS": [
{
"cid": 111111,
"Name": "Hello",
"DefaultName": "guys",
}
]
}
],
[
{
"CID": 2222222,
"NAME": null,
"DEFAULT_NAME": "Hello World",
"REPRESENTATIONS": null,
"ALL_REPRESENTATIONS": [
{
"cid": 22222222,
"Name": "Hello",
"DefaultName": "World",
}
]
}
]
]
Json Format
I get [object Object] or something else in DEFAULT_NAME, NAME and CID. How can I do for this?
Thanks in advance,
Ben

Answer 1

One way to get the data from the nested array is to use the reader's transform configuration.
It is passed the raw (deserialized) data object. The transform
function returns a data object, which can be a modified version of the
original data object, or a completely new data object.
reader: {
type: 'json',
rootProperty: '',
transform: function(data) {
return Ext.Array.map(data, function(nestedDataArray) {
return nestedDataArray[0];
});
}
}
This way you get rid of the enclosing array and normalize the data.
Here is a working fiddle: https://fiddle.sencha.com/#view/editor&fiddle/25ut

Answer 2

If you have One-To-Many relaition in your model, use 'hasMany' property in model config:
Ext.define("Test.model.RepresentationModel", {
extend: 'Ext.data.Model',
fields: [
'cid', 'Name', 'DefaultName'
],
belongsTo: 'Test.model.PathModel'
});
Ext.define('Test.model.PathModel', {
extend: 'Ext.data.Model',
fields: [
{name:'CID', type:'auto'},
{name:'NAME', type:'auto'},
{name:'DEFAULT_NAME', type:'auto'},
{name:'REPRESENTATIONS', type:'auto'}
],
hasMany: {model: 'Test.model.RepresentationModel', name: 'ALL_REPRESENTATIONS'},
});