Hirarchialy editable grids

[Sagi]

Hi!

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. 

Can you please help with this issue?

Thanks!

outer grid:

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: ,
        detailInit: onExpansion,
        toolbar: ["create"],
        columns: [
            { field: "field1", title: "field1" },
            { field: "field2", title: "field2" },
            { field: "field3", title: "field3" },
            { command: ["destroy"], title: " " }],
        editable: true
    });

onExpansion:

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

 

 

[Vladimir Iliev]

Hello Sagi,

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). 

Regards,
Vladimir Iliev
Telerik