Question

我想要像AngularJS 'watch' function这样的东西。当用户编辑一行时，我想触发一个事件。 In this example此事件在用户点击某一行时捕获，但我想要一个只有在用户更改数据时才能捕获的事件。

Answer 1

在网格的edit事件中，获取对已编辑数据项（e.model）和bind到change事件的引用。

edit: function(e) {
    e.model.bind("change", function(j) {
        // ...
    });
}

<强>更新

如果您要更新网格中的数据项或其他内容，请将keyup处理程序附加到所需的文本框或编辑窗口小部件，然后触发change，以便模型更新。（可选）使用模型本身的change事件来修改页面上的其他值或内容。

http://dojo.telerik.com/oKiyE

＆＃13;

        $(document).ready(function () {
          var dataSource = new kendo.data.DataSource({
            pageSize: 20,
            data: products,
            schema: {
              model: {
                id: "ProductID",
                fields: {
                  ProductID: { editable: false, nullable: true },
                  ProductName: { validation: { required: true } },
                  UnitsInStock: { type: "number", validation: { required: true } }
                }
              }
            }
          });

          $("#grid").kendoGrid({
            dataSource: dataSource,
            pageable: true,
            height: 550,
            toolbar: ["create"],
            columns: [
              { field: "ProductName", title: "Product Name" },
              { field: "UnitsInStock", title: "Units in Stock" },
              { title: "Product Name readonly", template: "<span id='Product#= ProductID#'>#= ProductName #</span>" },
              { command: "edit", title: " ", width: "150px" }],
            editable: "inline",
            edit: function(e) {
              var model = e.model;

              var input = e.container.find("[name=ProductName]");

              input.keyup(function(){
                input.trigger("change");
              });

              model.bind("change", function(j){
                if (j.field == "ProductName") {
                  model.set("UnitsInStock", model.get("UnitsInStock") + 1);
                  $("#Product" + model.get("ProductID")).html(model.get("ProductName"));
                }
              });
            }
          });
        });

        function readOnlyEditor(container, options) {
          container.html(options.model.get(options.field));
        }

＆＃13;

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8"/>
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.914/styles/kendo.common.min.css"/>
    <link rel="stylesheet" href="http://kendo.cdn.telerik.com/2016.3.914/styles/kendo.silver.min.css"/>

    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://kendo.cdn.telerik.com/2016.3.914/js/kendo.all.min.js"></script>
  </head>
  <body>

    <script src="http://demos.telerik.com/kendo-ui/content/shared/js/products.js"></script>

      <div id="grid"></div>

  </body>
</html>

＆＃13;

用户编辑时是否有可以捕获行数据更改的事件？

1 个答案: