Nested grid breaks upon enabling editing

[Anita]

I have a set of grids, one acting as a main grid, which is editable, and works fine. 

There is then a detail grid. When the detail grid is set to not editable, by commenting out all editable/command/toolbar sections, it works fine. However, upon including even just one of those, it causes an invalid template error. Code is included below for the two grids. the second one is the one causing the issue. 

 

 

@(Html.Kendo().Grid<eCurriculumAdminJunior.Models.Feedback.Section>()
    .Name("SectionGrid")
    .Columns(col =>
    {
        col.Bound(x => x.position).Title("Section").ClientTemplate("Section #=position#").HtmlAttributes(new { style = "width: 40%" });
        col.Bound(x => x.viewableby).Title("Visibility").EditorTemplateName("VisibleTo").ClientTemplate("#=ArrayToString(data.viewableby)#").HtmlAttributes(new { style = "width: 30%" });
        col.Command(command =>
        {
            command.Edit().IconClass("glyphicon glyphicon-edit").Text(" ").HtmlAttributes(new { style = "text-decoration: none" });
            command.Destroy().IconClass("glyphicon glyphicon-ban-circle").Text(" ").HtmlAttributes(new { style = "text-decoration: none" });
        }).Width("5em").Title(" ");
    })
    .RowAction(row => row.DetailRow.Expanded = true)
    .ToolBar(x => x.Create())
    .Events(x => x.Edit("defaultSectionIndexer"))
    .Editable(x => x.Mode(GridEditMode.InLine))
    
    .DataSource(ds => ds.Ajax()
        .Model(m =>
        {
            m.Id(i => i.id);
            m.Field(f => f.id).DefaultValue(-1).Editable(false);
            m.Field(f => f.position).DefaultValue(-1).Editable(false);

        })
        .Batch(false)
        .ServerOperation(false)
        .Read(r => r.Action("ReadSection", "FeedbackForm", new { formID = Model }))
        .Update(u => u.Action("UpdateSection", "FeedbackForm"))
        .Create(c => c.Action("CreateSection", "FeedbackForm", new { formID = Model }))
        .Destroy(d => d.Action("DeleteSection", "FeedbackForm"))
        .Sort(s => s.Add(x => x.position))
    ).ClientDetailTemplateId("sectionHeaderTemplate")
)
<script id="sectionHeaderTemplate" type="text/kendo">

    <text>Headers</text>
    @(Html.Kendo().Grid<eCurriculumAdminJunior.Models.Feedback.SectionHeader>()
        .Name("SectionHeaderGrid#=id#")
        .Columns(col =>
        {
            col.Bound(c => c.position).Hidden(true);
            col.Bound(c => c.text).EditorTemplateName("RichText").HtmlAttributes(new { style = "width: 60%" });
            col.Bound(c => c.viewableby).Title("Visibility").EditorTemplateName("VisibleTo").ClientTemplate("#=ArrayToString(data.viewableby)#").HtmlAttributes(new { style = "width: 30%" });
            col.Command(command =>
            {
                command.Edit().IconClass("glyphicon glyphicon-edit").Text(" ").HtmlAttributes(new { style = "text-decoration: none" });
                command.Destroy().IconClass("glyphicon glyphicon-ban-circle").Text(" ").HtmlAttributes(new { style = "text-decoration: none" });
            }).Width("5em").Title(" ");
        })
        .ToolBar(t =>
        {
            t.Create();
        })
        .DataSource(ds => ds.Ajax()
        .Model(m =>
        {
            m.Id(id => id.id);
            m.Field(f => f.id).DefaultValue(-1);

        })
        .ServerOperation(false)
        .Read(r => r.Action("ReadSectionHeader", "FeedbackForm", new { sectionID = "#=id#" }))
        .Update(u => u.Action("UpdateSectionHeader", "FeedbackForm"))
        .Create(c => c.Action("CreateSectionHeader", "FeedbackForm",new { sectionID = "#=id#" }))
        .Destroy(d => d.Action("DeleteSectionHeader", "FeedbackForm"))
        ).ToClientTemplate()
    )
    <text>Content</text>
   
</script>

[Anita]

It turned out that it was an editor template being buggy. Please ignore this.