how do I get the ID of the selected row from the d

I have a heirical kendo grid being used in my main grid, my question is that how do I get the ID of the selected row from the detailInit, then collapse the detailInit and place that selected data into the parent grid?

My grid looks like this

    function TheCatalogGrid(catalogData) {
    $("#CatalogGrid").kendoGrid({
        dataSource: {
            data: catalogData
        },

        columns: [
           { field: "globalGroupID", title: "Group ID", hidden: true },
           { field: "globalGroupLevel", title: "globalGroupLevel", hidden: true },
           { field: "globalGroupName", title: "Group Name", width:350 },
           { field: "isRequired", title: "*", width:20 },
           { field: "optionName", title: "Option Name" },
           { title: "Description" },
           { title: "Price" }
        ],

        change: function (e) {
            onSelectedRowClick();
        },
        scrollable: true,
        pageable: false,
        selectable: "row",
        height: 500,
        dataBound: function (e) {
            var data = this.dataSource.data();
            $.each(data, function (i, row) {
                if (row.get("globalGroupLevel") == 0) {
                    var element = $('tr[data-uid="' + row.uid + '"] ');
                    element.addClass("colored-row");
                }
            });
        },
        detailInit: detailInit
    });
}

and my detailInit looks like this

    function detailInit(e) {
    $("<div/>").appendTo(e.detailCell).kendoGrid({
        dataSource: {
            type: "odata",
            transport: {
                read: "//demos.telerik.com/kendo-ui/service/Northwind.svc/Orders"
            },
        },
        scrollable: false,
        selectable: "row",
        columns: [
            //{ field: "OrderID", width: "110px" },
            { field: "ShipCountry", title: "Option Name" },
            { field: "ShipAddress", title: "Description" },
            { field: "ShipName", title: "Price" }
        ]
    });
}

Place selected data into the parent grids row from where the row of the grid is selected

I know that the column headers don't make sense, but its my testing before I put it to production.

You can use detailExpand event to get master row and id value.

var globalGroupId = null;

detailExpand: function(e) {
   console.log(e.masterRow, e.detailRow);
   var globalGroupId = e.masterRow.get("globalGroupID");
}

Then add change method for you detail grid and there do the trick

change: function(e) {

    // get detail row
    var detailRow = this.dataItem(this.select());
    var shipCountry = detailRow.get("ShipCountry")

    // get master row
    var masterGrid = $("#grid").getKendoGrid();
    var masterRow = masterGrid.dataSource.get(employeeId);

    // set 'ship country' value to master row 'Country' field
    masterRow.set("Country", shipCountry);

},

Look this Dojo