1

有谁知道如何在页脚剑道网格 MVVM 上显示页面大小下拉列表和刷新按钮喜欢这个

这是我的视图代码：

<div id="customer-grid"
            data-role="grid"
            data-sortable="true"
            data-selectable="true"
            data-pageable="true"
            data-pagesizes="[5, 10, 20]"
            data-columns='[
            { field: "CustomerID", title: "ID", width: "75px" },
            { field: "CompanyName", title: "Company"},
            { field: "ContactName", title: "Contact" },
            { field: "ContactTitle", title: "Title" },
            { field: "Address" },
            { field: "City" },
            { field: "Region" },
            { field: "PostalCode" },
            { field: "Country" },
            { field: "Phone" },
            { field: "Fax" } ]'
            data-bind="source: customerSource">
    </div>

这是我的数据源代码：

var customerSource = new kendo.data.DataSource({
        transport: {
            read: {
                async: false,
                url: crudServiceBaseUrl,
                dataType: "json"
            }
        },

        serverPaging: true,
        pageSize: 10,
        schema: {
            model: customerModel,
            data: "data",
            total: "count"
        },
    });

提前致谢。

4

1 回答 1

2

你应该定义data-pageable为：

data-pageable="{ refresh: true, pageSizes: [5, 10, 20]  }"

请注意，页面大小数组是在中定义的，data-pageable而不是在data-pagesizes.

所以你的网格定义是：

<div id="customer-grid"
        data-role="grid"
        data-sortable="true"
        data-selectable="true"
        data-pageable="{ refresh: true, pageSizes: [5, 10, 20] }"
        data-columns='[
            { field: "CustomerID", title: "ID", width: "75px" },
            { field: "CompanyName", title: "Company"},
            { field: "ContactName", title: "Contact" },
            { field: "ContactTitle", title: "Title" },
            { field: "Address" },
            { field: "City" },
            { field: "Region" },
            { field: "PostalCode" },
            { field: "Country" },
            { field: "Phone" },
            { field: "Fax" } ]'
        data-bind="source: customerSource">
</div>

在这里检查：http: //jsfiddle.net/9zL6J/

于 2014-05-08T05:59:08.990 回答