2

我正在为我的 js + HTML5 SPA 使用Knockout-Kendo.js库。在我的视图模型中，我有一个myItemsKnockout Observable Array。我有一个客户端存储库，负责从服务器获取数据并保存它。我希望能够myItems根据对 API 的 POST 请求填写我的视图模型，该 API 将过滤器对象（包含过滤器和分页信息）发送到服务器并返回过滤项目的列表。

  • 据我所知，Knockout-Kendo 不支持 Kendo Grid DataSource。我应该通过它的data属性 instesd设置源dataSource。我对吗？如果是，我能达到下面问题中的要求吗？
  • 如何设置网格的选项，以便为服务器分页设置结果总数、页码、顶部、跳过等？（例如，我应该能够根据单击的 Kendo Grid 的页码在视图模型中设置我的过滤器对象，并将其与我的 POST 请求一起发送到服务器。）
  • 此外，为了能够获得分页项目的总数，我应该以如下格式从服务器接收 JSON 数据：{total: 675, data: {some JSON array containing items for the current page}}还是有其他方法可以实现这一点？
4

2 回答 2

2

如果您需要在 Knockout-Kendo 中实际使用数据源，您实际上可以直接使用。如果您使用datafalse 或指定选项，然后也{}指定dataSource选项，那么它将使用它。

例如，您可以像这样绑定它：

<div data-bind="kendoGrid: gridOptions"></div>

使用视图模型：

var grid = {
  data: false,
  dataSource: {
    type: "odata",
    transport: {
      read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
    },
    schema: {
      model: {
        fields: {
          OrderID: {
            type: "number"
          },
          Freight: {
            type: "number"
          },
          ShipName: {
            type: "string"
          },
          OrderDate: {
            type: "date"
          },
          ShipCity: {
            type: "string"
          }
        }
      }
    },
    pageSize: 50,
    serverPaging: true,
    serverFiltering: true,
    serverSorting: true
  },
  height: 250,
  sortable: true,
  pageable: true,
  columns: [{
    field: "OrderID",
    filterable: false
  },
    "Freight", {
    field: "OrderDate",
    title: "Order Date",
    width: 100,
    format: "{0:MM/dd/yyyy}"
  }, {
    field: "ShipName",
    title: "Ship Name",
    width: 200
  }, {
    field: "ShipCity",
    title: "Ship City"
  }]
};

ko.applyBindings({
  gridOptions: grid
});

示例：http: //jsfiddle.net/rniemeyer/shwrb/

于 2013-03-09T16:25:42.107 回答
0

dataSource: { pageSize: 20 } 像这样指定....如果你只提到 pageSize: 20 这样的，它不起作用

于 2014-01-02T11:15:20.703 回答