Struts 2.3.1.5 and jQuery Plugin v3.6 - trying to iterate data returned from JSON with nested object

We've spent couple of days trying to figure it out but we couldn't so we decide to ask for your opinion here.

We have a collection which returns a JSON data. The code beneath will render a table and a subgrid table. In the Parent table we've located some data which is okay. But in the subgrid table we're unable to load anything.

What are we doing wrong?

 {
   "sales":[
      {
         "client":{
            "id":1,
            "name":"Jon Doe",
            "phone":"35900022233"
         },
         "goods":[
            {
               "description":"Good Description",
               "id":3,
               "name":"Good name",
               "price":10.0
            },
            {
               "description":"Good Description 2",
               "id":2,
               "name":"Good name 2",
               "price":1.87
            },
            {
               "description":"Good Description 3",
               "id":1,
               "name":"Good name 3",
               "price":2.5
            }
         ]
}

<s:url var="sales" value="/getSales"/>

<sjg:grid
    id="salesTable"
    caption="Sales List"
    dataType="json"
    href="%{sales}"
    pager="true"
    gridModel="sales"
    rowList="10,15,20"
    rowNum="15"
    rownumbers="true"
    width="900"
    shrinkToFit="true"
    viewrecords="true"
>

    <sjg:grid 
        id="goodssubgridtable"
        caption="Goods"
        dataType="json"
        subGridUrl="%{sales}"
        gridModel="goods"
        width="true"
        shrinkToFit="false"
    >
    
    <sjg:gridColumn name="name"  title="Name"  />
    <sjg:gridColumn name="description"  title="Description"  />
    <sjg:gridColumn name="price" title="Price" />
</sjg:grid>

<sjg:gridColumn name="id" index="id" width="50" title="ID" sortable="false"/>
<sjg:gridColumn name="quantity" index="quantity" width="200" title="Quantity" sortable="false" />
<sjg:gridColumn name="totalAmount" index="totalAmount" width="300" title="Total amount" sortable="false" />
<sjg:gridColumn name="client.id" title="Client ID" width="100"/>
<sjg:gridColumn name="client.name" title="Client name" />
<sjg:gridColumn name="client.phone" title="Phone number" />

</sjg:grid>

Since Goods is not in the root of the object returned, you should use the right path in the notation, like gridModel="sales[0].goods" .

Refer to this amazing answer for more details on how to traverse JSON objects.

Edit: the JSON you posted here seems malformed, but it's probably just a copy & paste issue; however, try with an hardcoded index; if it works, you should get, IF POSSIBLE, the index of the row to pass through OGNL, since you are not inside an iterator, but inside a custom tag :/

But looking at the official Showcase's source code, it is done in a completely different way: two different URLs pointing to two different Actions for the Grid and the subGrid. I think that is the way it is meant to be used. Browse the repository to find the Actions too if you need to check the business they perform