0

I have json returning from an API that is not consistant, meaning some records have "age" associated with them while others do not.

I am trying to populate a Kendo UI Grid in order to display/manipulate the data. Unfortunately, when the records that do not have "Age" associated with them return with records that do, kendo breaks down with an error: Uncaught ReferenceError: Age is not defined

Here is the example of the working grid: http://jsfiddle.net/tmort/CVkpF/

And here is the grid with one record returning without "Age": http://jsfiddle.net/tmort/CVkpF/1/ - You can see the error appear in the Console, not on the page itself.

Is there any way I can make the grid dynamic enough to understand that age hasn't returned, set it to null, and then continue on?

Code I'm using:

    var data = [
    {
    FirstName: 'John',
    LastName: 'Doe',
    City: 'New York City',
    Title: 'Supervisor',
    BirthDate: '1/1/1975',
    Age: '37',
    },
    {
    FirstName: 'Jane',
    LastName: 'Doe',
    City: 'Buffalo',
    Title: 'Sales Associate',
    BirthDate: '1/1/1980',

    }
    ]
$(document).ready(function() {
        var grid = $("#grid").kendoGrid({
            dataSource: {
                data: data,
                schema: {
                    model: {
                        fields: {
                            FirstName: { type: "string" },
                            LastName: { type: "string" },
                            City: { type: "string" },
                            Title: { type: "string" },
                            BirthDate: { type: "date" },
                            Age: { type: "number" }
                        }
                    }
                },
                pageSize: 10
            },
            height: 500,
            scrollable: true,
            sortable: true,
            selectable: true,
            filterable: true,
            pageable: true,
            columns: [
                {
                    field: "FirstName",
                    title: "First Name"
                },
                {
                    field: "LastName",
                    title: "Last Name"
                },
                {
                    field: "City"
                },
                {
                    field: "Title"
                },
                {
                    field: "BirthDate",
                    title: "Birth Date",
                    template: '#= kendo.toString(BirthDate,"MM/dd/yyyy") #'
                },
                {
                    field: "Age"
                }
            ]
        }).data("kendoGrid");

    });

​Any help greatly appreciated. Thanks!

4

4 回答 4

1

剑道网格不支持缺失值。您的对象必须包含每行的每个成员才能将其绑定到网格。空白/空值应该就是这样 - 空字符串或空值，但它们必须存在于您的 JSON 结果中。

于 2012-07-19T18:34:55.660 回答
0

我不确定剑道网格是否那么灵活，但是您可以做的是在将数据源放入网格之前对其进行处理。您可以将年龄添加为数据源中的字段或根据存在的 hte 字段设置网格。如果您在源上执行 CRUD 操作，这可能效果不佳，但如果它只是显示数据，这可能对您很有效。

其他人可能对剑道框架有更好的了解，这只是一个快速解决方法的建议！

希望能帮助到你！

于 2012-05-29T14:22:31.427 回答
0

为什么不尝试将缺少的字段（年龄）发送为空。如果您从控制器获取数据，您可以添加一个额外的字段并将其发送到 UI。这将使事情以适当的方式工作。只是我的观点...

于 2012-06-14T00:00:48.353 回答
0

为您的列添加带有 data.field 的模板将起作用，即。

       ...
       columns: [
            {
                field: "FirstName",
                title: "First Name",
                template: "#= data.FirstName != null ? FirstName : '' #"
            },
            {
                field: "LastName",
                title: "Last Name",
                template: "#= data.LastName != null ? LastName : '' #"
            },
            {
                field: "City",
                template: "#= data.City != null ? City : '' #"
            },
            {
                field: "Title",
                template: "#= data.Title != null ? Title : '' #"
            },
            {
                field: "BirthDate",
                title: "Birth Date",
                template: '#= data.BirthDate != null ? kendo.toString(BirthDate,"MM/dd/yyyy") : "" #'
            },
            {
                field: "Age",
                template: "#= data.Age != null ? Age : '' #"
            }
        ]
        ...
于 2016-12-08T16:04:32.807 回答