如何从detailInit获取所选行的ID，然后折叠detailInit并将所选数据放入父网格? [英] 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?

问题描述

我在主网格中使用了一个继承性剑道网格，我的问题是如何从detailInit获取所选行的ID，然后折叠detailInit并将所选数据放入父网格?

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?

我的网格看起来像这样

    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
    });
}

我的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.

推荐答案

您可以使用detailExpand事件获取主行和id值.

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);

},

查看此 Dojo

这篇关于如何从detailInit获取所选行的ID，然后折叠detailInit并将所选数据放入父网格?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！