Hello all,

I'm developing a 3 level igHierarchicalGrid, in javascript, based on multiple-levels-multiple-layouts example, and I got to work the first two levels, when opening the third level I got the following error: Uncaught Error: There was an error parsing/evaluating the JSON string: Unexpected token o ig.ui.min.js:1.

I have double-checked the Javascript code and the json file and all seems correct and similiar to other multi-level igHierarchicalGrid examples, nonetheless I got error in the columnLayout with the key "Artigos". My code is the following:

My Javascript code:

$("#hg").igHierarchicalGrid({
initialDataBindDepth: 1,
dataSource: jsonData,
dataSourceType: 'json',
responseDataKey: 'd.results',
width: "750px",
autoGenerateColumns: false,
autoGenerateLayouts: false,
primaryKey: "Gama",

columns: [
{ key: "Gama", headerText: "Gama", width: "130px", dataType: "string" },
{ key: "Descricao", headerText: "Descrição", width: "265px", dataType: "string" }
],
autoGenerateLayouts: false,
columnLayouts: [
{
key: "Familias",
responseDataKey: "results2",
autoGenerateColumns: false,
autoGenerateLayouts: false,
primaryKey: "Familia",
foreignKey: "Gama", 
columns: [
{ key: "Familia", headerText: "Familia", width: "100px", dataType: "string" },
{ key: "Descricao2", headerText: "Descrição", width: "100px", dataType: "string" }
],
columnLayouts: [
{
key: "Artigos",
responseDataKey: "results3",
autoGenerateColumns: false,
autoGenerateLayouts: false,
primaryKey: "Artigo",
foreignKey: "Familia", 
columns: [
{ key: "Artigo", headerText: "Artigo", width: "100px", dataType: "string" },
{ key: "Descricao3", headerText: "Descrição", width: "100px", dataType: "string" },
{ key: "Preco", headerText: "Preço", width: "100px", dataType: "string" }
]
}
]
},

{
key: "Familias",
responseDataKey: "results2",
autoGenerateColumns: false,
autoGenerateLayouts: false,
primaryKey: "Familia",
foreignKey: "Gama", 
columns: [
{ key: "Familia", headerText: "Familia", width: "100px", dataType: "string" },
{ key: "Descricao2", headerText: "Descrição", width: "100px", dataType: "string" }
],
columnLayouts: [
{
key: "Artigos",
responseDataKey: "results3",
autoGenerateColumns: false,
autoGenerateLayouts: false,
primaryKey: "Artigo",
foreignKey: "Familia", 
columns: [
{ key: "Artigo", headerText: "Artigo", width: "100px", dataType: "string" },
{ key: "Descricao3", headerText: "Descrição", width: "100px", dataType: "string" },
{ key: "Preco", headerText: "Preço", width: "100px", dataType: "number" }
]
}
]
}

],
features:[
{ name: 'Sorting' },
{ name: "Filtering", allowFiltering: true, caseSensitive: false, columnSettings: [
{columnKey: "Gama", allowFiltering: false} 
]}
]
});

My Json file:

{
"d": {
"results": [
{
"Gama": "88",
"Descricao": "Vazio",
"Familias": {
"results2": [
{
"Familia": "888",
"Descricao2": "Vazio",
"Artigos": {
"results3": [
{
"Artigo": "8424219033741",
"Descricao3": "HAMBURGER VITELA,,4P",
"Preco": "1.7376"
},
{
"Artigo": "8424219027993",
"Descricao3": "RECHEADO PORCO MIL FOLHAS,,1P",
"Preco": "7.6224"
}
]
}
}
]
}
}
]
}
}

Can anyone tell me what I'm doing wrong?