DevExtreme nested table won't expand on sorting parent table

Question

I'm using the DevExtreme Nested Data Grid (dx-data-grid) in an Angular application to display hierarchical data. My data structure consists of a parent table, and each row in the parent table can have child rows, which can further have grandchild rows (children of the child rows).

• When I initialize the grid, all child and grandchild rows are correctly expanded. However, when I sort the parent table by clicking on a column header, the following issue occurs:
• The first-level child rows (directly under the parent rows) remain expanded as expected. However, the grandchild rows (children of the first-level child rows) unexpectedly collapse.

I have also created a minimal reproducible example on CodeSandbox to better illustrate the issue.

codeSandbox

to reproduce the problem:

1. expand the row with the ID 2.

2. Exapand the child row with ID 3.

3. Now Click on the column name of the first table which includes the row with ID 1 and 2.

Can anyone help me understand why the grandchild rows are collapsing after sorting the parent table, and provide a solution to prevent this behavior? I would greatly appreciate any guidance or suggestions to resolve this issue.

Answer 1

so i think u should try masterdetail in your Datagrid