过滤 kendo 网格中的脏行

Question

我有一个 kendo 网格通过 odata 连接到一个相当大的 table。我使用批量编辑。我需要能够过滤所有对其进行更改的行，以便用户可以在将更改提交到数据库之前查看这些更改。知道我该怎么做吗？谢谢

Answer 1

是否还需要显示已删除 条记录（未同步）？否则，您可以使用以下条件设置过滤器：

{
    field: "dirty", 
    operator: "equals", 
    value: true 
}

类似于：

grid.dataSource.filter({
    field: "dirty", 
    operator: "equals", 
    value: true 
});

$(document).ready(function () {
  var crudServiceBaseUrl = "http://demos.telerik.com/kendo-ui/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 } }
            }
          }
        }
      });

  var grid = $("#grid").kendoGrid({
    dataSource: dataSource,
    navigatable: true,
    pageable: true,
    height: 550,
    toolbar: [
      "create", 
      "save", 
      "cancel"
    ],
    columns: [
      "ProductName",
      { field: "UnitPrice", title: "Unit Price", format: "{0:c}" },
      { field: "UnitsInStock", title: "Units In Stock" },
      { field: "Discontinued" },
      { command: "destroy", title: " " }],
    editable: true
  }).data("kendoGrid");

  $("#dirty").on("click", function(e) {
    console.log("dirty", grid.dataSource.data());
    grid.dataSource.filter({
      field: "dirty", 
      operator: "equals", 
      value: true 
    });
    e.preventDefault();
  });
  $("#all").on("click", function(e) {
    grid.dataSource.filter({});
    e.preventDefault();
  });
});

html { 
  font-size: 12px; 
  font-family: Arial, Helvetica, sans-serif; 
}

<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.common.min.css" />
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1119/styles/kendo.default.min.css" />
<script src="http://cdn.kendostatic.com/2014.3.1119/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.3.1119/js/kendo.all.min.js"></script>

<button id="dirty" class="k-button">Dirty</button>
<button id="all" class="k-button">All</button>
<div id="grid"></div>

过滤 kendo 网格中的脏行

Filter dirty rows in kendo grid

kendo-ui

kendo-grid