This is a migrated thread and some comments may be shown as answers.
Kendo Grid Detail Template Grid Not Binding (after first row)
2 Answers 30 Views
This is a migrated thread and some comments may be shown as answers.
Dev
Top achievements
Rank 1
Dev asked on 10 Aug 2017, 07:56 PM

The detail template grid is not binding the data properly. If I expand one by one from top to bottom, it only binds the data for the first row and the grid inside all other rows are empty. If I expand them from bottom to top, it binds the data properly for all the rows. Any idea why it's doing this?

@(Html.Kendo().Grid<EmailInvitationViewModel>()
                            .Name("EmailInviteeGrid")
                            .Columns(columns =>
                            {
                                columns.Bound(e => e.EmailInviteID).Hidden(true);
                                columns.Bound(e => e.InvitationDate).Title("Invited On").Hidden(false);
                                columns.Bound(e => e.ClassDetails).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains"))).Title("Class Details");
                            })
                            .Sortable()
                            .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                            .Pageable(pageable => pageable
                              .Refresh(true)
                              .PageSizes(true)
                              .ButtonCount(5))
                            .ClientDetailTemplateId("template")
                            .DataSource(dataSource => dataSource
                                .Ajax()
                                .PageSize(10)
                                .Read(read => read.Action("GetAllInvitedEvents", "Controller", new { Model.EventID }))
                            ))
                        )
    <script id="template" type="text/kendo-tmpl">
        @(Html.Kendo().Grid<EmailInvitationViewModel>()
        .Name("grid_#=EmailInviteID#") 
        .Columns(columns =>
        {
            columns.Bound(o => o.GridInviteeEmail);
        })
        .DataSource(dataSource => dataSource
            .Ajax()
            .PageSize(10)
        .Read(read => read.Action("GetAllInviteeEmailsByEvent", "DataSource", new { EventID = "#=EventID#", EmailInviteID = "#=EmailInviteID#" }))
        )
        .Pageable()
        .Sortable()
        .ToClientTemplate()
                        )
    </script>

2 Answers, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 14 Aug 2017, 12:02 PM
Hello Team,

The provided configuration looks good.

Based on it I can assume that values different than the expected ones are passed to the GetAllInviteeEmailsByEvent action.

I can suggest inspecting if the correct values are received in the Controller action, and then if the Controller is returning the expected values based on the expanded row.

If all values are as expected, please provide a fully runnable example as the issue may be caused by a custom factor which we are overlooking at this moment.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Dev
Top achievements
Rank 1
answered on 15 Aug 2017, 03:55 PM
Got it to work! The name of the sub-grid had to be unique for each master row.
Tags
Grid
Asked by
Dev
Top achievements
Rank 1
Answers by
Stefan
Telerik team
Dev
Top achievements
Rank 1
Share this question
or