Uncaught TypeError: Cannot read property 'set' of undefined variable masterRow is undefined in KendoUI Grid detailInit

Question

我向对方发了一个问题，有人回答了，, which i was thankful for, I modified my code to match the other members code that he set up in the Telerik Dojo Heres a dojo 一切顺利，直到我到达

var masterRow = masterGrid.dataSource.get(groupID);

这就是我将其视为未定义的地方，我不确定为什么...我的完整代码是

function onSelectedRowClick(e) {
    var catalogGrid = $("#CatalogGrid").data("kendoGrid");
    var selectedID = catalogGrid.dataItem(catalogGrid.select());
    var theID = selectedID.globalGroupID;
    myID = theID;
    groupID = myID;
}

var myID;

// #region Catalog Grid

var groupID;

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

        columns: [
           { 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,
        detailExpand: function(e){
            groupID = this.dataItem(e.masterRow).get("globalGroupID");
        },
    });
}
function detailInit(e) {
    $("<div/>").appendTo(e.detailCell).kendoGrid({
        dataSource: {
            transport: {
                read: URLParams.GetTheGlobalGroupOptions + "?id=" + groupID
            },
        },
        scrollable: false,
        selectable: "row",
        filter: { field: "GlobalGroupID", operator: "eq", value: e.data.globalGroupID },
        change: function (e) {
            // get detail row
            var detailRow = this.dataItem(this.select());
            var optionName = detailRow.get("OptionName") // Change this stuff to populate into the correct columns

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

            // set 'Option Name' value to master row 'optionName' field
            masterRow.set("optionName", optionName);

        },
        columns: [
            { field: "OptionName", title: "Option Name" },
            { field: "OptionDescription", title: "Description" },
            { field: "OptionPriceComment", title: "Price" }
        ]
    });
}

知道为什么它是未定义的吗？

Answer 1

您的逻辑很好...但由于某些原因，dataSource.get 似乎没有正确搜索指定的 groupID。您可以使用 grid.dataItem 作为解决方案。

首先，确保提供给主网格的数据具有数据源列中定义的 optionName 属性（不确定它是否真的重要，但我将其添加到您的 Dojo example 只是为了确定）。

第二个要更改的是 detailInit 函数。该函数将接收 e.masterRow 作为参数，因此您无需在主网格中搜索即可获取链接的 masterRow。但是，请确保 detailInit 中的 e 变量与 change 函数的 e 变量不冲突，方法是重命名其中一个变量或保留引用，就像我在以下示例中所做的那样：

function detailInit(e) {
    var masterRow = e.masterRow; //Keep a reference to your masterRow to avoid conflict with change... you could also use a different name
    $("<div/>").appendTo(e.detailCell).kendoGrid({
        dataSource: [{ OptionName: "Delivery"}, {OptionName: "PickUp"}],
        scrollable: false,
        selectable: "row",
        filter: { field: "globalGroupID", operator: "eq", value: e.data.globalGroupID },
        change: function (e) {
            var detailRow = this.dataItem(this.select());
            var optionName = detailRow.get("OptionName") // Change this stuff to populate into the correct columns

            //Use the masterRow directly to get the dataItem from the master grid
            $("#grid").getKendoGrid().dataItem(masterRow).set("optionName", optionName);
        },
        columns: [
            { field: "OptionName", title: "Option Name" },
            { field: "OptionDescription", title: "Description" },
            { field: "OptionPriceComment", title: "Price" }
        ]
    });
}

Uncaught TypeError: Cannot read property 'set' of undefined variable masterRow is undefined in KendoUI Grid detailInit

Uncaught TypeError: Cannot read property 'set' of undefined variable masterRow is undefined in KendoUI Grid detailInit

asp.net-mvc

jquery

kendo-ui

kendo-grid