From e03c7499af55323705735244511e91a6689fb728 Mon Sep 17 00:00:00 2001
From: Masha_Rudenko <mlutova@xbsoftware.com>
Date: Mon, 24 Mar 2025 15:17:19 +0300
Subject: [PATCH 1/2] [add] a note on using root id for treegrid/tree in a
 sub-row

---
 docs/grid/api/grid_subrow_config.md | 31 +++++++++++++++++++++++++++++
 docs/grid/configuration.md          | 31 +++++++++++++++++++++++++++++
 2 files changed, 62 insertions(+)

diff --git a/docs/grid/api/grid_subrow_config.md b/docs/grid/api/grid_subrow_config.md
index 812b78ab..8c02316b 100644
--- a/docs/grid/api/grid_subrow_config.md
+++ b/docs/grid/api/grid_subrow_config.md
@@ -60,6 +60,37 @@ const grid = new dhx.Grid("grid_container", {
 });
 ~~~
 
+:::info
+For Grid (in the TreeGrid mode) or Tree used in a sub-row it is important to specify the id of the root element to link data to the corresponding collection:  
+- by using the [`rootParent`](grid/api/grid_rootparent_config.md) property for Grid in the TreeGrid mode 
+- by using the [`rootId`](tree/api/tree_rootid_config.md) property for Tree 
+:::
+
+For example:
+
+~~~jsx {8,16}
+grid = new dhx.Grid("grid_container", {
+    columns: [
+        // columns config
+    ],
+    data: dataset,   
+    subRow: (row) => { 
+      subGrid = new dhx.Grid(null, {
+            rootParent: "root", // Add the root id
+            columns: [
+                { id: "country", header: [{ text: "Country" }] },
+                { id: "order_quantity", header: [{ text: "Orders" }], type: "number" },
+                { id: "average_check", header: [{ text: "Avg check" }], type: "number" },
+            ],
+            data: row.data,
+            autoWidth: true,
+            type: "tree",
+        });
+        return subGrid;
+    }, 
+}); 
+~~~
+
 **Related sample:** [Grid. Row expander. Full config](https://snippet.dhtmlx.com/xdw2037t)
 
 **Related article:** [Row expander](grid/configuration.md#row-expander)
diff --git a/docs/grid/configuration.md b/docs/grid/configuration.md
index b3cb274c..96880688 100644
--- a/docs/grid/configuration.md
+++ b/docs/grid/configuration.md
@@ -1688,6 +1688,37 @@ const grid = new dhx.Grid("grid_container", {
 
 **Related sample:** [Grid. Row expander. Full config](https://snippet.dhtmlx.com/xdw2037t)
 
+:::info
+For Grid (in the TreeGrid mode) or Tree used in a sub-row it is important to specify the id of the root element to link data to the corresponding collection: 
+- by using the [`rootParent`](grid/api/grid_rootparent_config.md) property for Grid in the TreeGrid mode 
+- by using the [`rootId`](tree/api/tree_rootid_config.md) property for Tree 
+:::
+
+For example:
+
+~~~jsx {8,16}
+grid = new dhx.Grid("grid_container", {
+    columns: [
+        // columns config
+    ],
+    data: dataset,   
+    subRow: (row) => { 
+      subGrid = new dhx.Grid(null, {
+            rootParent: "root", // Add the root id
+            columns: [
+                { id: "country", header: [{ text: "Country" }] },
+                { id: "order_quantity", header: [{ text: "Orders" }], type: "number" },
+                { id: "average_check", header: [{ text: "Avg check" }], type: "number" },
+            ],
+            data: row.data,
+            autoWidth: true,
+            type: "tree",
+        });
+        return subGrid;
+    }, 
+}); 
+~~~
+
 ### Adjusting configuration of sub-rows
 
 You can define common configuration settings of all sub-rows or provide specific options for each sub-row via the [`subRowConfig`](grid/api/grid_subrowconfig_config.md) configuration property of Grid.

From bf2bfb4e57f920b37b6ea56e13e888a0ea48b19e Mon Sep 17 00:00:00 2001
From: Masha_Rudenko <mlutova@xbsoftware.com>
Date: Mon, 23 Mar 2026 13:40:24 +0300
Subject: [PATCH 2/2] [fix] correct code samples for grid in a sub-row

---
 docs/grid/api/grid_subrow_config.md | 15 +++++++--------
 docs/grid/configuration.md          | 15 +++++++--------
 2 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/docs/grid/api/grid_subrow_config.md b/docs/grid/api/grid_subrow_config.md
index 63225e00..7300ed9e 100644
--- a/docs/grid/api/grid_subrow_config.md
+++ b/docs/grid/api/grid_subrow_config.md
@@ -73,13 +73,13 @@ For Grid (in the TreeGrid mode) or Tree used in a sub-row it is important to spe
 For example:
 
 ~~~jsx {8,16}
-grid = new dhx.Grid("grid_container", {
+const grid = new dhx.Grid("grid_container", {
     columns: [
         // columns config
     ],
-    data: dataset,   
-    subRow: (row) => { 
-      subGrid = new dhx.Grid(null, {
+    data: dataset,
+    subRow: (row) => (
+        new dhx.Grid(null, {
             rootParent: "root", // Add the root id
             columns: [
                 { id: "country", header: [{ text: "Country" }] },
@@ -89,10 +89,9 @@ grid = new dhx.Grid("grid_container", {
             data: row.data,
             autoWidth: true,
             type: "tree",
-        });
-        return subGrid;
-    }, 
-}); 
+        })
+    ),
+});
 ~~~
 
 **Related sample:** [Grid. Row expander. Full config](https://snippet.dhtmlx.com/xdw2037t)
diff --git a/docs/grid/configuration.md b/docs/grid/configuration.md
index 926a7f78..2d9c65ac 100644
--- a/docs/grid/configuration.md
+++ b/docs/grid/configuration.md
@@ -2226,13 +2226,13 @@ For Grid (in the TreeGrid mode) or Tree used in a sub-row it is important to spe
 For example:
 
 ~~~jsx {8,16}
-grid = new dhx.Grid("grid_container", {
+const grid = new dhx.Grid("grid_container", {
     columns: [
         // columns config
     ],
-    data: dataset,   
-    subRow: (row) => { 
-      subGrid = new dhx.Grid(null, {
+    data: dataset,
+    subRow: (row) => (
+        new dhx.Grid(null, {
             rootParent: "root", // Add the root id
             columns: [
                 { id: "country", header: [{ text: "Country" }] },
@@ -2242,10 +2242,9 @@ grid = new dhx.Grid("grid_container", {
             data: row.data,
             autoWidth: true,
             type: "tree",
-        });
-        return subGrid;
-    }, 
-}); 
+        })
+    ),
+});
 ~~~
 
 ### Adjusting configuration of sub-rows