15

是否可以在读取数据之前以编程方式设置 KendoUI 数据源的排序参数并避免第二次服务器读取？范围是在特定用户交互上设置默认排序。如何？

这是我正在尝试做的一个例子，因为答案没有得到重点（或者我可能不了解事情是如何运作的）。

我用初始排序定义了一个 Kendo DataSource：

var datasource = new kendo.data.DataSource({
    parameterMap: function (inputParams, operation) {
        return JSON.stringify(inputParams)
    },
    // default sort
    sort: [
        {field: "field_1", dir: "asc"},
        {field: "field_2", dir: "asc"}
    ]
});

此 DataSource 绑定到 Kendo 网格：

var grid = $("element").kendoGrid({
    dataSource: datasource   
});

然后我有一个按钮，它在 DataSource 上调用“读取”并用第一页数据填充网格：

$("#btn").bind("click", function(e) {
    datasource.page(1);
});

这样，在单击按钮后，用户会获取按“field_1”和“field_2”排序的数据，并且网格会在列标题上显示这种排序。然后，用户可以通过单击列标题以任何方式重新排序数据。

我想做的是将默认排序重置为初始排序，如 DataSource 声明中定义的那样，在列标题上再次显示它，而无需再次创建新的 DataSource。

就像是：

$("#btn").bind("click", function(e) {
    datasource.sort = [
        {field: "field_1", dir: "asc"},
        {field: "field_2", dir: "asc"}
    ]; 
    datasource.page(1);
});

提供的解决方案似乎没有达到目的（我仍然不明白为什么我会因为一个似乎不是那么微不足道的合法问题而失去声誉点，应该由框架解决）。

请告诉我我错了（我不担心失去声誉 - 我只想了解如何解决问题）。

4

5 回答 5

30 
var kendoGrid = $("#grid").data('kendoGrid');
var dsSort = [];
dsSort.push({ field: "fieldName1", dir: "asc" });
dsSort.push({ field: "fieldName2", dir: "desc" });
kendoGrid.dataSource.sort(dsSort);
于 2013-07-12T20:50:44.267 回答
2

这是一个 jsfiddle 正是您要问的：http: //jsfiddle.net/MechStar/c2S5d/

简而言之，您首先需要将 dataSource 设置为 null，然后在您从用户那里获得所需的输入时注入 dataSource：

myKendoGrid.data("kendoGrid").setDataSource(getKendoDataSource("ShipName", "asc"));

var getKendoDataSource = function (sidx, sord) {
  return new kendo.data.DataSource({
    type: "odata",
    transport: {
      read: "http://demos.kendoui.com/service/Northwind.svc/Orders"
    },
    pageSize: 10,
    serverPaging: true,
    serverSorting: true,
    sort: {
      field: sidx ? sidx : "",
      dir: sord ? sord : ""
    }
  });
};
var myKendoGrid = $("#grid").kendoGrid({
  columns: [
    { field: "OrderID" },
    { field: "ShipName" },
    { field: "ShipCity" }
  ],
  dataSource: null,
  pageable: {
    pageSizes: [10, 20, 50, 100, 200]
  },
  resizable: true,
  scrollable: false,
  sortable: {
    allowUnsort: false
  }
});
$("#link").click(function () {
  myKendoGrid.data("kendoGrid")
    .setDataSource(getKendoDataSource("ShipName", "asc"));
});
于 2013-12-16T03:06:36.453 回答
1

是的。可以通过排序设置。

于 2012-12-13T15:34:51.913 回答
1

所以你想在它第一次读取数据之前设置排序？只需确保您的 ui 控件上有 autobind: false ，然后在数据源上设置排序属性，然后在准备好获取排序数据时调用 datasource.read() 。

于 2012-12-13T18:38:43.177 回答
1

我知道你正在努力实现什么。我必须这样做，因为我们正在保存用户排序和过滤（在我的情况下是客户端），并且由于其他原因我们不能使用网格函数getOptions/setOptions。即使你设置了 autobind:false这也不会像你期望的那样工作，如果你看到 autobind 的定义：

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#configuration-autoBind

如果设置为 false，则小部件在初始化期间不会绑定到数据源。在这种情况下，数据绑定将在触发数据源的更改事件时发生。默认情况下，小部件将绑定到配置中指定的数据源。

当您执行dataSource.sort()时，这会触发一个更改事件，然后隐式地在 dataSource 中完成读取（这就是您有第二个服务器读取的原因）。

因此，您需要做的是创建一个具有所需排序选项的新数据源，然后显式调用dataSource.read()。

例如（您可以扩展默认选项以不重复配置）：

var options = $.extend({}, dataSourceOptions);
options.sort = [
        {field: "field_1", dir: "asc"},
        {field: "field_2", dir: "asc"}
    ];
var dataSource = new kendo.data.DataSource(options);
grid.setDataSource(dataSource);
grid.dataSource.read();

希望这有帮助。问候！

于 2016-06-29T11:09:16.530 回答