2

我想使用 MVC 助手在服务器端构建网格，但是在我想在客户端添加和删除行之后。

所以我使用以下包装器：

@(Html.Kendo().Grid<SIGEPos.Models.MyGridViewModel>()
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.id).Hidden();
        columns.Bound(p => p.name).Title("Name").Width(130);
        columns.Bound(p => p.quantity).Title("Quantity").Width(130);
    })
    .Pageable()
    .Scrollable(scr=>scr.Height(430)) 
    .DataSource(dataSource => dataSource        
        .Ajax()
        .PageSize(20)
        .ServerOperation(false)        
     )
)

并生成以下标记（仅显示脚本部分）：

<script>
    jQuery(function () {
        jQuery("#Grid").kendoGrid({
            "columns": [{
                "title": "id",
                "hidden": true,
                "field": "id",
                "filterable": {},
                "encoded": true
            }, {
                "title": "Name",
                "width": "130px",
                "field": "name",
                "filterable": {},
                "encoded": true
            }, {
                "title": "Quantity",
                "width": "130px",
                "field": "quantity",
                "filterable": {},
                "encoded": true
            }],
            "pageable": {
                "buttonCount": 10
            },
            "dataSource": {
                "transport": {
                    "prefix": "",
                    "read": {
                        "url": ""
                    }
                },
                "pageSize": 20,
                "page": 1,
                "total": 0,
                "type": "aspnetmvc-ajax",
                "schema": {
                    "data": "Data",
                    "total": "Total",
                    "errors": "Errors",
                    "model": {
                        "fields": {
                            "id": {
                                "type": "number"
                            },
                            "quantity": {
                                "type": "number"
                            },
                            "name": {
                                "type": "string"
                            }
                        }
                    }
                }
            }
        });
    });
</script>

这样我就无法在客户端对网格进行分页。我可以添加项目，但grid.dataSource.total()总是0这样分页不起作用......

我检查了这个演示，生成的代码有点不同： 

$(document).ready(function() {
                $("#grid").kendoGrid({
                    dataSource: {
                        data: products,
                        schema: {
                            model: {
                                fields: {
                                    ProductName: { type: "string" },
                                    UnitPrice: { type: "number" },
                                    UnitsInStock: { type: "number" },
                                    Discontinued: { type: "boolean" }
                                }
                            }
                        },
                        pageSize: 20
                    },
                    height: 430,
                    scrollable: true,
                    sortable: true,
                    filterable: true,
                    pageable: {
                        input: true,
                        numeric: false
                    },
                    columns: [
                        "ProductName",
                        { field: "UnitPrice", title: "Unit Price", format: "{0:c}", width: "130px" },
                        { field: "UnitsInStock", title: "Units In Stock", width: "130px" },
                        { field: "Discontinued", width: "130px" }
                    ]
                });
            });

似乎dataSource配置不同......我该如何处理？

4

1 回答 1

0

您必须 serverPaging: false在filterable属性下设置。kendo 网格的数据源是一个 json，您必须在其中指定行数，当然还有数据匹配列声明。

于 2019-03-05T21:14:13.827 回答