0

我无法让 Kendo Grid 从服务器端数据填充。

我有一个网格构建器功能如下:

    var build = function (carrier, date) {
    var urlBase = 'my base url';

    var datasource = new kendo.data.DataSource({
        pageSize: 20,
        serverPaging: true,
        serverFiltering: true,
        serverSorting: true,
        schema: {
            model: {
                id: 'Id',
                fields: {
                    StatementDate: { type: "string", editable: false },
                    CobDate: { type: "string", editable: false },
                    //lots more fields
                    Status: { type: "string", editable: false },
                    Matched: { type: "boolean", editable: true }
                }
            }
        },
        transport: {
            read: function (options) {
                var address = urlBase + '/' + carrier + '/' + date;
                $.ajax({
                    url: address,
                    type: "POST",
                    data: JSON.stringify(options.data),
                    contentType: "application/json",
                    success: function (result) {
                        options.success(result);
                    },
                    error: function (result) {
                        options.error(result);
                    }
                });
            },                
            //update function omitted
            parameterMap: function (data, operation) {
                if (operation == "read") {
                    return JSON.stringify(data)
                }
            },
            change: function (e) {
                var data = this.data();
                console.log(data.length); // displays "77"
            }
        }
    });

    return datasource;
};

return {
    build: build
}

网格定义

elem.kendoGrid({
            columns: [
                { field: "StatementDate", title: "State Date", width: 125 },
                { field: "CobDate", title: "COB Date", width: 100 },
            //lots more fields
            { command: ["edit"], title: " ", width: "85px"}],
            resizable: true,
            sortable: true,
            editable: "inline",
            columnMenu: true,
            filterable: true,
            reorderable: true,
            pageable: true,
            selectable: "multiple",
            change: this.onSelectedRecordChanged,
            toolbar: kendo.template($('#' + templateName).html()),
            scrollable: {
                virtual: true
            },
            height: 800
        });

我通过单击按钮触发更新。当我查看响应时,我看到了数据。看起来不错,但网格不会显示数据。当数据完全是客户端时,它以前工作得很好。

如果我在 AJAX 回调上断点。我看到了正确的结果。

网格与数据绑定绑定。数据源是视图模型上的属性。

<div id="grid" data-bind="source: dataSource"></div>

在应用程序的开始。我创建视图模型

var viewModel= kendo.observable(new GridViewModel(...

并绑定

kendo.bind($('#grid'), viewModel);

如果我查看附加到网格的数据源,我会按预期看到页面的数据

当数据是客户端时,这以前工作得很好。

我尝试在数据源上使用 read(),在网格上使用 refresh() 方法。两者似乎都不起作用。

来自服务器的示例响应内容

{"Data":[{"Id": //lots more fields, 20 records],"Total":90375,"AggregateResults":null,"Errors":null} 

非常感谢任何帮助。

4

1 回答 1

1

我发现数据源模式丢失的原因

{ data: 'Data', total: 'Total' }
于 2013-10-21T12:25:12.770 回答