Kendo UI中的可编辑分层网格

Question

I wish to create a grid that each row has grid inside it.

Both grids need to be editable and I managed to do so. However, when I try to add a new row to the outer grid, all the data inside it gone.

You can find the demo here: http://dojo.telerik.com/UqURE

Can you please help with this issue?

Thanks!

var outerDataSource= new kendo.data.DataSource({
        schema: {
            model: {
                field1: { type: "string", validation: { required: true } },
                field2: { type: "boolean", validation: { required: true } },
                field3: { type: "string", validation: { required: true } }
            }
        }
    });

$("#outerGrid").kendoGrid({
    dataSource: outerDataSource,
    detailInit: onExpansion,
    toolbar: ["create"],
    columns: [
        { field: "field1", title: "field1" },
        { field: "field2", title: "field2" },
        { field: "field3", title: "field3" },
        { command: ["destroy"], title: " " }],
    editable: true
});
function onExpansion(e) {
    var insideDataSource= new kendo.data.DataSource({
        schema: {
            model: {
                in1: { type: "string", validation: { required: true } },
                in2: { type: "string", validation: { required: true } }
            }
        },
        data: [{
            in1: "Click to edit",
            in2: "Click to edit"
        }]
    });

    var headers = $("<div/>").appendTo(e.detailCell).kendoGrid({
        dataSource: insideDataSource,
        width: 90,
        toolbar: ["create"],
        editable: true,
        columns: [
          { field: "in1" },
          { field: "in2" },
          { command: ["destroy"], title: "&nbsp;" }]
    });
};

Answer 1

Answer from Telerik:

Please note that operations like paging, sorting, filtering and editing cause the Grid to rebind and reevaluate all templates inside it (including the details). That why in order to preserve the child Grid data between rebinds you should either save it to remove service (link to documentation here) or add it as navigation property collection to the parent Grid model (demo is available here).

http://www.telerik.com/forums/hirarchialy-editable-grids