如何在文本值更改時獲取 Kendo-UI 網格行數據

Question

我正在為 jQuery 使用 Kendo UI。 我的網格有 2 列：浮點數和文本。 當值改變時，我需要得到一個網格行。 對於數字字段，一切正常，但對於文本字段，則不能：調用處理程序函數，但如何在其中獲取網格數據？ （我使用相同的處理程序，但沒關系）。

export class MyGrid {
    constructor() {
        let that: MyGrid = this;

        $("#MyGrid").kendoGrid({
            dataBound: function (e) {
                this.tbody.find(".MyNumericValue").each(function () {
                    $(this).kendoNumericTextBox({
                        format: "n3",
                        decimals: 3,
                        change: that.onValueChange.bind(that)
                    });
                });

                // Event function is called, but how to get row data?
                this.tbody.find(".MyTextValue").each(function () {
                    $(this).on("change", that.onValueChange.bind(that))
                });
            }
        });
    }
}

列：

let columns = [
    {
        title: "Decimal value",
        field: "RoadLength",
        template: "<input name='RoadLength' class='MyNumericValue' value='#: RoadLength #' />"
    },
    {
        title: "Text value",
        field: "Name",
        template: "<input name='Name' class='k-textbox MyTextValue' value='#: Name #' />"
    }
];

事件：對於文本框“ e.sender.element.closest("tr") ”不起作用。

onValueChange(e: any): void {
    let g = $("#MyGrid").data("kendoGrid");
    let dataItem = g.dataItem(e.sender.element.closest("tr"));
    let name: string = e.sender.element[0].name;
    let value = e.sender.value();
    // dataItem.set(name, value);    
}

Answer 1

使用kendoNumericTextBox 的change 事件，e.sender 是kendoNumericTextBox 本身， e.sender.element是原始widget 的jQuery 實例。 上面的事件處理程序應該可以正常工作。

對於普通文本字段，更改事件是一個 jQuery事件。 沒有e.sender ，因此上面的代碼會產生錯誤。 在這種情況下，我們使用 $(e.target)。

您的代碼可能應該將這兩種情況分開。

順便說一句，像這樣的Web 瀏覽器的 javascript 錯誤通知程序擴展程序將幫助您輕松識別問題。

希望這有幫助！