Question

是否存在等同于Kendo Grid的onEditComplete的事件，其中只有在编辑了单元格的内容后才会触发事件？

Documentation提到“编辑”事件，但是一旦单元格进入编辑模式，这就会触发（所以这相当于onBeginEdit）。

我发现的具有所需行为的最接近事件是“保存”事件，但此事件仅在更改了单元格内容时触发。我希望一旦单元格退出编辑模式就会触发一个事件。

网格的编辑模式设置为incell。

Answer 1

所以由于评论我删除了我之前的答案 - 使用输入框（或其他元素）上的模糊事件似乎有效：

在grid.edit事件中，使用jquery绑定到文本框（或任何其他内联编辑控件）的模糊事件，该事件在焦点丢失时触发。将其附加到网格定义...并显然用您的代码替换警报。

edit: function (e) {
        alert('Edit Fired');
        $('input.k-input.k-textbox').blur(function () {
            alert('blur event called');
        });
    },

我通过修改示例内联编辑代码here

对此进行了测试

我完整的本地编辑源 - 仅查看网格def上的编辑事件：

<div id="example" class="k-content">
    <div id="grid"></div>

    <script>
        $(document).ready(function () {
            var crudServiceBaseUrl = "http://demos.kendoui.com/service",
                dataSource = new kendo.data.DataSource({
                    transport: {
                        read: {
                            url: crudServiceBaseUrl + "/Products",
                            dataType: "jsonp"
                        },
                        update: {
                            url: crudServiceBaseUrl + "/Products/Update",
                            dataType: "jsonp"
                        },
                        destroy: {
                            url: crudServiceBaseUrl + "/Products/Destroy",
                            dataType: "jsonp"
                        },
                        create: {
                            url: crudServiceBaseUrl + "/Products/Create",
                            dataType: "jsonp"
                        },
                        parameterMap: function (options, operation) {
                            if (operation !== "read" && options.models) {
                                return { models: kendo.stringify(options.models) };
                            }
                        }
                    },
                    batch: true,
                    pageSize: 20,
                    schema: {
                        model: {
                            id: "ProductID",
                            fields: {
                                ProductID: { editable: false, nullable: true },
                                ProductName: { validation: { required: true } },
                                UnitPrice: { type: "number", validation: { required: true, min: 1 } },
                                Discontinued: { type: "boolean" },
                                UnitsInStock: { type: "number", validation: { min: 0, required: true } }
                            }
                        }
                    }
                });

            $("#grid").kendoGrid({
                dataSource: dataSource,
                pageable: true,
                height: 430,
                toolbar: ["create"],
                // added in hook to here to bind to edit element events.  
                // blur is fired when an element loses focus
                edit: function (e) {
                    alert('Edit Fired');
                    $('input.k-input.k-textbox').blur(function (e) {
                        alert('blur event called');
                    });
                },
                columns: [
                    "ProductName",
                    { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "100px" },
                    { field: "UnitsInStock", title: "Units In Stock", width: "100px" },
                    { field: "Discontinued", width: "100px" },
                    { command: ["edit", "destroy"], title: "&nbsp;", width: "172px" }],
                editable: "inline"
            });
        });
    </script>
</div>

Answer 2

使用Save事件

（当焦点移动到正在编辑的单元格之外时触发在细胞关闭之前）

http://www.kendoui.com/forums/kendo-ui-web/grid/is-there-an-event-that-first-after-a-user-edits-a-cell-but-before-they-save-in-a-grid-with-batch-edit-and-incell-editing-.aspx.

Answer 3

为什么不使用“模糊”事件？

http://www.kendoui.com/forums/ui/window/possible-to-close-window-when-it-loses-focus-.aspx

    $("#window").blur(function(){
      if ($(document.activeElement).closest(".k-window").length == 0) {
        $("#window").data("kendoWindow").close();
      }
    });

http://api.jquery.com/blur/

Answer 4

您是否尝试过Change Event

“变化

当用户选择网格中的表格行或单元格时触发。“

示例 - 使用单元格选择时获取所选数据项

<div id="grid"></div>
<script>
function grid_change(e) {
  var selectedCells = this.select();
  var selectedDataItems = [];
  for (var i = 0; i < selectedCells.length; i++) {
    var dataItem = this.dataItem(selectedCells[i].parentNode);
    if ($.inArray(dataItem, selectedDataItems) < 0) {
      selectedDataItems.push(dataItem);
    }
  }
  // selectedDataItems contains all selected data items
}
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ],
  selectable: "multiple, cell"
});
var grid = $("#grid").data("kendoGrid");
grid.bind("change", grid_change);
</script>

Kendo Grid相当于onEditComplete

4 个答案: