Kendo ui - Get Parent Grid Item (Grid Hierarchy) on child add / edit

Question

I have a parent grid that has 3 items, each of these item has a sub grid as part of details. When edit event on the CHILD is called, I would like to get the data for the parent (masterrow), below code always gets the first item in the mastergrid and not the actual parent of the items clicked, for example if i edit/add an item in the grid for the second item in master grid, it still gets the first item of the mastergrid data.

 var parentData = $("#gridRoomTypes").data("kendoGrid").dataItem(e.container.closest("tr"));

edit has:

 e.sender (child grid), e.container, e.model "gridRoomTypes" is my master grid

Solution 1

If e.sender is child grid that you just edit, this should work:

var parentData = $("#gridRoomTypes").data("kendoGrid").dataItem(e.sender.element.closest("tr").prev());

Solution 2

Here is how you can access the Parent Row along with its model

.....
.......

$("#YOUR_DETAIL_GRID").kendoGrid({
    ....
    ......
    //ON CLICK ADD/EDIT BUTTON FOR CHILD ROWS
    edit: function(e) {

        var detailGridWrapper = this.wrapper;
        // GET PARENT ROW ELEMENT
        var parentRow = detailGridWrapper.closest("tr.k-detail-row").prev("tr");
        // GET PARENT GRID ELEMENT
        var parentGrid = parentRow.closest("[data-role=grid]").data("kendoGrid");
        // GET THE PARENT ROW MODEL
        var parentModel = parentGrid.dataItem(parentRow);

        // ACCESS THE PARENT ROW MODEL ATTRIBUTES
        var some_parent_row_attribute = parentModel.some_attribute;
    }