Kendo Grid: Add New Row With Nested Object Stopped Working

I'm filling a Kendo data grid from nested JSON by this way: https://stackoverflow.com/a/24441318/535556 Everything works fine until I click on the 'Add new row' button. Then I rec

Solution 1:

When you add a new row without having defined a schema model for the dataSource, the object being created does not yet have an "address" field. The column with "address.street" is attempting to get the "street" field from the "address" field of the new object which is undefined at this point, hence the error.

The bad news is that the schema model definition doesn't really lend itself to nested types. The good news is that you can define an "address" field with defaultValue of {} and the Grid editor should be happy.

$("#myGrid").kendoGridEx({...columns: [
        { field:"address.street" },
        { field:"address.city" },
        { field:"address.state" },

        ...

    ],dataSource:newkendo.data.DataSourceEx({...schema: {
            model: {
                id:"Id",
                fields: {
                    address: { defaultValue: {} },
                },
            },
        },...}),});

Now when you add a new row, the bound object's "address" field will be {}. The "street", "city" and "state" fields will of course be undefined, but their parent object "address" IS defined so you won't see and error when accessing it's fields.