Question

我让json从一个不一致的API返回，这意味着某些记录与它们相关的“年龄”，而其他记录没有。

我正在尝试填充Kendo UI Grid以显示/操作数据。不幸的是，当没有与其关联的“年龄”的记录返回记录时，kendo会因错误而崩溃：未捕获的ReferenceError：未定义年龄

以下是工作网格的示例：http://jsfiddle.net/tmort/CVkpF/

这是一个没有“年龄”的记录返回的网格：http://jsfiddle.net/tmort/CVkpF/1/ - 您可以看到错误出现在控制台中，而不是页面本身。

有什么方法可以使网格足够动态，以了解年龄没有返回，将其设置为null，然后继续？

我正在使用的代码：

    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");

    });

任何帮助非常感谢。谢谢！

Answer 1

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

Answer 2

我不确定kendo网格是否灵活，但您可以做的是在将数据源放入网格之前处理数据源。您可以将Age添加为数据源中的字段，或根据存在的hte字段设置网格。如果您在源上执行CRUD操作，这可能不会起作用，但如果它只显示数据，这可能对您有用。

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

希望它有所帮助！

Answer 3

为什么不尝试将缺少的字段（Age）发送为null。如果要从控制器获取数据，可以添加一个额外的字段并将其发送到UI。这将使事情以适当的方式发挥作用。只是我的意见......

Answer 4

为你的列添加一个带有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 : '' #"
            }
        ]
        ...

Kendo Grid JSON不一致

4 个答案: