【问题标题】:Kendo grid making duplicate API calls剑道网格重复 API 调用
【发布时间】:2014-06-05 18:54:04
【问题描述】:

我有一个处理服务器端分页、过滤和排序的 API。为了构建 dataSource url,我将 transport.read 设置为一个函数(如described in the documentation)。这很好用,除了我的 API 被调用了两次:在初始 ajax 请求期间一次,然后在调用 options.success(result) 之后再次调用。还有其他人遇到这个吗?当 options.success() 已经拥有所需的数据时,它究竟做了什么导致另一个 XHR GET 请求?


更新:

感谢 Rick 在下面的评论,我做了我今天早上应该做的事情,并开始评论其他剑道网格配置代码,看看会发生什么。原来当数据源改变时执行的函数导致了第二个 API 调用。这是必需的,因此在对网格进行排序时,发送到 API 的 URL 包含更新的排序请求。我想现在我很困惑为什么当我已经设置默认排序参数时更改事件会在初始加载时触发。在下面更新了我的配置。


这是我的数据源传输配置:

var initGrid = function (take, skip, currPage, field, direction, model, gridElement, cols) {
    //set up dataSource
    var dataSource = new kendo.data.DataSource({
        transport: {
            read: function (options) {
                $.ajax({
                    url: apiUrl + '?take=' + take + '&skip=' + skip + '&page=' + currPage + '&pageSize=' + take + '&sort%5B0%5D%5Bfield%5D=' + field + '&sort%5B0%5D%5Bdir%5D=' + direction,
                    dataType: 'json',
                    success: function (result) {
                        // by the time this is reached, the API has already been called once
                        // the result variable contains the necessary data
                        options.success(result); // the API is called again when this line executes
                    },
                    error: function (result) {
                        options.error(result);
                    }
                });
            }
        },
        change: function () {
            var currentSorting = JSON.stringify(this.sort());
            if (currentSorting != sorting) {
                sorting = currentSorting;
                this.sort(JSON.parse(sorting));
            }
            field = JSON.parse(sorting)[0].field;
            direction = JSON.parse(sorting)[0].dir;
        },
        sort: { field: field, dir: direction }, //default sort

        ....

    }
}

【问题讨论】:

  • 很可能是您拥有的其他代码导致了这种情况。我可以创建一个与您完全相同的数据源的简单示例,它只调用一次 URL。
  • 优秀的评论。结果更新了我的问题。曾尝试断点以查看代码是否被命中,但之前没有将其注释掉。啊。

标签: javascript jquery kendo-ui telerik kendo-grid


【解决方案1】:

原来问题在于使用 dataSource 更改事件来尝试检测排序何时更新。我没有意识到我已经可以访问 transport.read 函数的“选项”参数中的所有更新属性。因此,我没有监听更改事件、更新变量和手动调用排序,而是首先在构建 URL 时使用了选项对象。 Take、skip、page、pageSize 和 sort 都在那里。这样,剑道就可以自己处理所有事情。新配置:

var initGrid = function (model, gridElement, cols) {
    //set up dataSource
    var dataSource = new kendo.data.DataSource({
        transport: {
            read: function (options) {
                $.ajax({
                    url: apiUrl + '?take=' + options.data.take + '&skip=' + options.data.skip + '&page=' + options.data.page + '&pageSize=' + options.data.pageSize + '&sort%5B0%5D%5Bfield%5D=' + options.data.sort[0].field + '&sort%5B0%5D%5Bdir%5D=' + options.data.sort[0].dir,
                    dataType: 'json',
                    success: function (result) {
                        options.success(result);
                    },
                    error: function (result) {
                        options.error(result);
                    }
                });
            }
        },
        sort: { field: 'Id', dir: 'desc' }, //default sort

        ....

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-09-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-11-12
    相关资源
    最近更新 更多