Hi Nikolay,

Thanks for the prompt response. I tried both your suggestions but the grid still doesn't render child elements.It shows only the column headers.For the second approach I modified the data source so that the json returned is:

{"page":0,

"records":922,

"rows":[{"id":359,"businessCode":"12121212","taskType":"Task","taskName":"Test","country":"DF","Status":"P","StartDate":"2012-10-23","Deadline":"",

"Activities":{"Activities":[{"ParentTaskId":0,"ProgressStatus":null,"IsProgressStatusEnabled":false , ............

Is there something still missing or misconfigured?

Thanks and regards,

Sudipto

Hi Nikolay,

Any update on this?

Thanks and regards,
Sudipto 

Hi, Sudipto.

Sorry for the little bit response. I've directly tried to modified your code but with no success for the moment. It's seems is something small that I'm missing too. That's why I get a working sample and starting from there I will start to modify it for your needs. Meanwhile you can try it also:

var adventureWorksCustomerSales = {
   "Records": [
   {
        "CustomerID":1,
        "TerritoryID":1,
        "AccountNumber":"AW00000001",
        "ModifiedDate":"\/Date(1097655307263)\/",
        "GeneratedSales":7136.9199321292353,
        "CustomerAddresses": {
              "Records": [
              {
                    "AddressID":832,
                    "AddressTypeID":3,
                    "ModifiedDate":"\/Date(996613200000)\/",
              }]
        }
    }]
}

$("#grid1").igHierarchicalGrid({
     dataSource: adventureWorksCustomerSales,
     dataSourceType: "json",
     responseDataKey: "Records",
     initialDataBindDepth: 1,
     autoGenerateColumns: false,
     primaryKey: "CustomerID",
     columns: [
         { key: "CustomerID", headerText: "CustomerID", dataType: "number" },
         { key: "TerritoryID", headerText: "TerritoryID", dataType: "number" },
         { key: "AccountNumber", headerText: "AccountNumber", dataType: "string" },
         { key: "ModifiedDate", headerText: "ModifiedDate", dataType: "date" },
         { key: "GeneratedSales", headerText: "GeneratedSales", dataType: "number" }
     ],
     autoGenerateLayouts: false,
     columnLayouts: [
     {
           key: "CustomerAddresses",
           responseDataKey: "Records",
           autoGenerateColumns: false,
           primaryKey: "AddressID",
           foreignKey: "CustomerID",
           columns: [
                   { key: "AddressID", headerText: "AddressID", dataType: "number" },
                   { key: "AddressTypeID", headerText: "AddressTypeID", dataType: "number" },
                   { key: "ModifiedDate", headerText: "ModifiedDate", dataType: "date" }
          ]
     }]
});

So please try this and I will do the same and will keep you posted.

Thanks you for the patience, Sudipto.

Best regards,

Nikolay Alipiev

Hi, Sudipto.

I found the problem. One of the them was that your primary key column is "id" while when set in the primaryKey and foreignKey it was capitalized "Id". The other thing was that the some of the child columns requested records that was not in the data source, at least that part that you've sent. That's why I left only two and also removed some other unnecessary settings. So I pasted the working sample here as well attached more advanced scenario as HTML file.

var ds = {"page":0, "records":922,
   "rows": [
    {
        "id":359,
         "businessCode":"12121212",
         "taskType":"Task",
         "taskName":"Task",
         "countryList":"AAA",
         "Status":"P",
         "StartDate":"2012-10-23",
         "Deadline":"",
         "Activities": [
         {
               "ParentTaskId":0,
               "ActivityId":480,
               "Name":"Update Acitivy 2 new 1 2 3",
               "IsNameEnabled": false,
               "BusinessCode":null,
               "AssignedTo": null,
               "IsAssignedToEnabled": false,
               "AssignedToName": null
          }]
      }]
};

$("#AllTasksGrid").igHierarchicalGrid({
        initialDataBindDepth: 1,
        showHeader: true,
        responseDataKey: 'rows',
        dataSource: ds,
        primaryKey: "id",
        autoGenerateColumns: false,
        columns: [
             { headerText: "Id", key: "id", dataType: "number"},
             { headerText: "Code", key: "businessCode", dataType: "string"},
             { headerText: "Type", key: "taskType", dataType: "string"},
             { headerText: "Task/Activity Name", key: "taskName", dataType: "string"},
             { headerText: "Country", key: "countryList", dataType: "string" },
             { headerText: "Status", key: "Status", dataType: "string" },
             { headerText: "Start Date", key: "StartDate", dataType: "string" },
             { headerText: "Deadline", key: "Deadline", dataType: "string" }
         ],
         autoGenerateLayouts: false,
         columnLayouts: [
         {
             key: "Activities",
             autoGenerateColumns: false,
             primaryKey: "ActivityId",
             foreignKey: "id",
             columns: [
                   { key: "ActivityId", headerText: "ID", dataType: "number" },
                   { key: "Name", headerText: "Name", dataType: "string" }
             ]
         }]
});

I will wait for your feedback and verification of the case.

Best regards,
Nikolay Alipiev

Hi Nikolay,

Your proposed solution worked . Thanks a lot for your help.

Regards,

Sudipto