Subgrid Binding Not Working

[Cynthia]

@(Html.Kendo().Grid<Zeus.Models.AnswerGroup>(Model.Groups)
    .Name("Grid")
    .Columns(columns =>
    {
        columns.Bound(p => p.Id);
        columns.Bound(p => p.QuestionGroupName);
    })
    .Sortable()
    .Pageable()
    .ClientDetailTemplateId("detailTemplate")
    .Events(e => e.DetailInit("onDetailInit"))
    .Events(e => e.DataBound("dataBound"))
)

<script id="detailTemplate" type="text/kendo-tmpl">
    @(Html.Kendo().Grid<Zeus.Models.AnswerDetail>()
        .Name("answersGrid_#=Id#")
        .AutoBind(false)
        .DataSource(ds => ds
            .Ajax()
            .ServerOperation(false)).ToClientTemplate()
     )
</script>

<script type="text/javascript" language="javascript">
    function dataBound(e) {
        this.expandRow(this.tbody.find("tr.k-master-row").first());
    }
    function onDetailInit(e) {
        var grid = $("#answersGrid_" + e.data.Id).data("kendoGrid");
        grid.dataSource.data(e.Groups.Answers);
    }
</script>

Above is a set of code.  Its not working.  I'm not sure why, maybe there is something obvious.  The grid shows up, but there is no child grid, and the columns are off by one.

[Dimiter Madjarov]

Hello Cynthia,


In the current configuration the parent Grid is configured with a server dataSource, which does not support a client detail template. You should either configure it with an Ajax dataSource or use a server detail template instead.

I wish you a great day!

 

Regards,
Dimiter Madjarov
Telerik