javascript - 首先加载剑道 UI 网格

Question

我对 Kendo UI Grid 有疑问。当我加载数据时(来自返回 json 数据格式的异步请求)，网格未正确呈现网格的页脚。当我单击以订购或分页网格时，它呈现良好。我的问题是:如何纠正这个错误？

看图片。

第一次加载:

按代码排序后，页脚看起来没问题。

如果有人知道我该如何纠正这个错误并分享它，我真的很感激。

谢谢。

客户端代码(Kendo版本:v2012.3.1114)

<script>

    var grid;

    $(document).ready(function () {
        var serviceUrl = "@Url.Action("GetAsyncData", "Home")";

        grid = $("#grid").kendoGrid({
            dataSource: {
                type: "json",
                transport: {
                    read: {
                        dataType: "json",
                        url: serviceUrl,
                        cache: false
                    }
                },
                schema: {
                    data: "data",
                    total: "count",
                    model: {
                        id: "Id"
                    }
                }               
            },
            height: 400,
            toolbar: [{ text: "New", className: "add-button" }],
            groupable: true,
            sortable: true,
            pageable: false,
            selectable: true,
            resizable: true,
            columns: [
                {
                    field: "Code",
                    title: "Cód.",
                    width: "150px",
                    filterable: true,
                    groupable: false,
                    sortable: true,
                    resizable: true
                },
                {
                    field: "Name",
                    title: "Nome",
                    filterable: true,
                    groupable: false,
                    sortable: true,
                    resizable: true
                }, {
                    field: "Contact",
                    title: "Contato",
                    encoded: false,
                    filterable: true,
                    groupable: true,
                    sortable: true,
                    resizable: true
                },
                { command: { name: "Editar", text: "", className: "edit-button custom-button edit" }, title: "", width: "50px", filterable: false, sortable: false, groupable: false, resizable: false },
                { command: { name: "Detalhes", text: "", className: "detail-button custom-button detail" }, title: "", width: "50px", filterable: false, sortable: false, groupable: false, resizable: false },
                { command: { name: "Excluir", text: "", className: "delete-button custom-button delete" }, title: "", width: "50px", filterable: false, sortable: false, groupable: false, resizable: false }
            ]
        }).data("kendoGrid");

        $("#grid").delegate(".add-button", "click", function (e) {
            window.location = '@Url.Action("Create")';
        });
    });

</script>

<div id="grid"></div>

Answer 1

您使用的是什么版本的 Kendo？我无法使用 Q3 版本复制该行为