Kendo Grid页脚未在页面加载时初始化

Question

我正在使用Kendo UI Grid来显示WCF服务所消耗的结果。我使用的剑道版本是.web.2013.2.716.open-source。我有一个问题，当页面加载页脚尚未初始化。它显示0页，没有要显示的项目。正在填充网格并且确实包含有效行。如果我对网格执行任何类型的操作（例如排序）或更改每页显示的行数，则页脚将包含有效信息。以下是JavaScript代码的副本：

<script>
    $(document).ready(function () {
        $("#customerGrid").kendoGrid({
            autoBind:true,
            dataSource: {
                change: function (results) {
                    console.log("Successful");
                },
                error: function (jqXHR, textStatus, errorThrown) {
                    console.log(textStatus)
                },
                transport: {
                    read: "/Services/SalesCRM_DBServices.svc/getCustomers",
                    dataType: "json"
                },
                schema: {
                    data: function (response) {
                        return response.d;
                    },
                    total:"total",
                    model: {
                        fields: {
                            AccountNumber: { type: "string" },
                            Name: { type: "string" },
                            ContactName: { type: "string" }
                        }
                    }
                },
            },
            height:325,
            filterable: true,
            sortable: true,
            serverPaging:true,
            pageable: {
                refresh: false,
                info: true,
                input: true,
                numeric: true,
                pageSize:5,
                pageSizes: true,
                previousNext: true
            },
            columns: [{
                field: "AccountNumber",
                title: "Account Number",
                width: "125px",
                filterable: false
            },
            {
                field: "Name",
                title: "Name",
                width: "200px",
                filterable: false
            },
            {
                field: "ContactName",
                title: "Contact Name",
                width: "200px",
                filterable: false
            },
            {
                command: [{ text: "SELECT" }],
                width: "50px"
            },
            ],
        });

    });
</script>

此外，这里是用于网格的元素的标记：

<div id="customerGrid"></div>

同样，网格正在填充，页脚显示在网格的底部，但是有0页，页脚表示“没有要显示的项目”。但是，当我对网格进行排序或更改要显示的行数时，页脚会显示2页和“1 - 5 of 9 items”。

任何人都可以提供有关此问题的帮助。非常感谢。

我查看过标题为“网页分页无法处理页面加载”的帖子。在Kendo UI Premium论坛上它并没有任何帮助。

Answer 1

很可能您没有在回复中返回"total"。

由于您在model定义中定义了一个名为total的字段，其中包含 的total来定义它。

服务器产生无效响应的示例：

{
    "d"    : [
        { "AccountNumber": 1, "Name": "John", "ContactName": "Jack" },
        { "AccountNumber": 2, "Name": "Jane", "ContactName": "Jack" },
        { "AccountNumber": 3, "Name": "Joe", "ContactName": "Jack" }
    ]
}

虽然这是一个有效的回复：

{
    "total": 3,
    "d"    : [
        { "AccountNumber": 1, "Name": "John", "ContactName": "Jack" },
        { "AccountNumber": 2, "Name": "Jane", "ContactName": "Jack" },
        { "AccountNumber": 3, "Name": "Joe", "ContactName": "Jack" }
    ]
}

如果您实际上不愿意发送总数，请将Model定义为：

schema   : {
    data : function (response) {
        return response.d;
    },
    total: function (response) {
        return response.d.length;
    },
    model: {
        fields: {
            AccountNumber: { type: "string" },
            Name         : { type: "string" },
            ContactName  : { type: "string" }
        }
    }
}

或更棘手但更简单：

schema   : {
    data : "d",
    total: "d.length",
    model: {
        fields: {
            AccountNumber: { type: "string" },
            Name         : { type: "string" },
            ContactName  : { type: "string" }
        }
    }
}