【问题标题】:kendo ui grid filter, sort and paging in the serverkendo ui网格过滤器,服务器中的排序和分页
【发布时间】:2014-02-06 13:05:21
【问题描述】:

我正在使用剑道网格并希望在服务器中执行过滤、排序和分页。我知道我应该添加到数据源:

serverPaging: true,
serverSorting: true

但是我如何告诉网格/数据源它应该使用哪个 url 进行排序、过滤等。 如果我想自己执行排序怎么办?我想使用剑道提供的控制,但我自己去服务器。有没有像“sortTriggered”这样的事件,我可以在其中调用“prevntDefault”或类似的东西......我不知道。

【问题讨论】:

  • 您使用的是哪种服务器端技术?
  • 不知道是否相关,但我们正在使用 wcf
  • 相关。所以现在我发布一个没有样板 JS 代码的简单配置。

标签: kendo-ui kendo-grid


【解决方案1】:

看看这个样本。它使用适用于 Windows Azure 的 MobileServices javascript api,但会向您展示如何自己处理服务器分页和排序。

http://jsbin.com/efeKiwO/11/edit

在数据源的传输函数上,每个方法(读取、更新、创建、销毁)都可以配置为一个函数(这是读取函数,它处理任何排序和分页)。

read: function(options) {
        // Get the table
        var table = client.getTable("Customer");

        // Build base query
        var query = table.includeTotalCount();

        // Add paging
        if(options.data.skip !== undefined && options.data.take !== undefined) {
          query = query.skip(options.data.skip).take(options.data.take);
        }

        // Add sorting
        if(typeof options.data.sort !== "undefined" && options.data.sort !== null) {
          for(var i = 0; i< options.data.sort.length; i++) {
            if(options.data.sort[i].dir === "desc") {
              query = query.orderByDescending(options.data.sort[i].field);
            }
            else {
              query = query.orderBy(options.data.sort[i].field);
              }
          }
        }

        var promise = query.read();

        promise.done(function(data) {
          options.success(data);
        });
      },

在该函数中,您可以做任何您喜欢的事情。您可以进行 $.getJSON 调用、$.ajax 调用或其他任何您想做的事情,而不是使用像这个示例这样的 javascript 库。函数的参数对象将包含分页、排序和过滤所需的一切。获得数据后,只需调用 options.success(dataSet);使用您正确排序/分页的数据集,您的网格将绑定到它。

【讨论】:

  • 这正是我想要做的,但是由于某种原因,当我将“serverSorting”添加到数据源时,排序不起作用并且没有调用读取函数。
  • 如果在客户端处理就不需要ServerSorting。
  • 如果我删除了“serverSorting”,那么 read 函数肯定不会被调用。无论如何,我解决了这个问题。现在可以使用了,谢谢。
【解决方案2】:

你的配置差不多了,

缺少的是连接到 MVC 的秘诀。

假设您的 DataSource 配置如下:

var myDataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: 'Users/Read',
            type: 'POST'
        }
    },
    serverSorting: true,
    serverFiltering: true,
    serverPaging: true
}

在 UsersController.cs(示例)中的服务器端,您必须接收 [DataSourceRequest]

public DataSourceResult Read([DataSourceRequest] DataSourceRequest request)
{
    // Here you might actually get the items from your cache or database. 
    var List<User> myList = new List<User>();         

    // Here is when the kendo magic happens. 
    return myList.ToDataSourceResult(request);
}

为什么 [DataSourceRequest] 很重要?

因为它包含您的网格向服务器询问的分页、排序、过滤参数。所以如果你想自己做算法,你必须检查请求并处理那些参数。只要记住返回一个 DataSourceResult 对象实例即可。

如果您的对象位于缓存中并且您的字段不需要对过滤、分组、排序等进行特殊处理,则只需使用 kendo C# 扩展 ToDataSourceResult。它将使用动态 LINQ 语句处理您的项目并应用过滤、排序、分页配置。

【讨论】:

  • 假设来自服务器端的实体框架或其他 IQueryable 结果,.ToDataSourceResult 将如何工作...据我了解,它将在内存中进行分页/排序等,而不是让 sql server 完成繁重的工作...
  • 嗯,这更像是一个要问剑道人的问题。我检查了他们的一些 C# 代码,是的,他们正在使用 LINQ 进行所需的所有转换,因此它实际上取决于备份您的 IEnumerable 的内容。因此,数据库有可能最终完成所有繁重的工作。只是不要在将查询传递给 kendo 之前将其具体化为内存中的对象。免责声明:我们还没有在我的公司购买使用最新剑道版本的许可证,因为我们不再依赖那个框架,所以我对服务器端剑道的了解可能已经过时了。
【解决方案3】:

Kendo 网格仅使用一个 url 来检索数据,它将从 DataSource 对象中获取。

网格每次需要数据时都会调用此 url,并且排序和分页参数将添加到基于网格上下文向服务器发出的每个请求中。

然后,服务器将收到一个标准 Web 请求,其中包含构建您自己的请求所需的所有参数。然后您必须以正确格式发送响应(例如:JSONP OData)。

【讨论】:

  • 所以我不能有任何我想要的网址?如果我有一个特殊的网址我不能使用它怎么办?
  • 您的意思是根据您想要的排序/页面,您有不同的 URL?
  • 你能在你的问题中添加一些例子吗?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2023-03-10
  • 2014-12-28
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-11-11
  • 2018-01-22
相关资源
最近更新 更多