使用剑道网格的分页在页面加载时不起作用答案

【问题标题】：Pagination using kendo grid does not work on page load使用剑道网格的分页在页面加载时不起作用
【发布时间】：2017-08-21 19:54:34
【问题描述】：

在我的 js 中。我正在使用 kendoGridOptions 加载数据。我已经映射了获取所有记录的数据源。我已经配置了 pageable = true。但是请注意，当页面加载时，分页选项不可用，它们仅在我对其中一列进行排序时才可用。以下是我的网格和数据源的配置

var enhancedGridOptions = mydataKendoGridManager.kendoGridOptions({

        dataSource: myGridDataSource,
        sortable: true,
        scrollable: true,
        editable:false,
        resizable: true,
        reorderable: true,
        pageable: true,
        columnResize: function (e) {
            adjustLastColumn(e, this);
        },
        columns:
            [
                {
                    field: "dealType",
                    title: $.i18n.prop('buyType.label'),
                    width: "108px"
                },
                {
                    field: "myStatus",
                    title: $.i18n.prop('myStatus.label'),
                    width: "105px"
                },
                {
                    field: "action",
                    title: $.i18n.prop('action.label'),
                    width: "105px"
                },
              ],
        pdf:
        {
            fileName: "my_List_" + (new Date()).toString(myformat + "_HH:mm") + ".pdf",
            allPages: true,
        },
        excel:
        {
            fileName: "my_List_" + (new Date()).toString(myformat + "_HH:mm") + ".xlsx",
            allPages: true,
        }

    }

我的数据源配置如下

 transport: {
                read: function (e) {
                    myapi.rootGet("data/mylist?dealId=" + id, function (response) {
                        var data;
                       // console.log(response.data)
                        if (_.isString(response.data)) {
                            response.data = JSON.parse(response.data);
                            data = response.data;
                            setTimeout(function () {
                                e.success(data);
                            }, 10000);
                        }
                        else {
                            e.error("XHR response", response.status, JSON.parse(response.data));
                        }
                    });
                },

            },
                schema:
            {
                model: {
                    id: "id",
                    fields: {
                        dealType: {
                            type: "string"
                        },
                        myStatus: {
                            type: "string"
                        },
                        action: {
                            type: "string"
                        },

                    }
                },
                parse:function(data)
                {
                    return parseData(data);
                }

            },
                serverSorting: false,
                serverFiltering: false,
                serverPaging: false
        };

如果有人可以指导在页面加载时不起作用的分页中缺少的内容，我们将不胜感激。

谢谢，安佳娜

【问题讨论】：

标签： kendo-grid

【解决方案1】：

如果您在网格的左下角收到“NaN - NaN of 500 items”之类的错误，那么您应该在 dataSource 属性中添加 pageSize。

var enhancedGridOptions = mydataKendoGridManager.kendoGridOptions({

    dataSource: {
        data: myGridDataSource,
        pageSize: 50
    },
    ....
    ....
    ....
    pageable: {
        pageSizes: [20, 30, 50, 100],
        buttonCount: 5
    }
});

【讨论】：