How to bind listview to grid detail template without posting to server

[sharon]

View

@(Html.Kendo().Grid(Model)
                .Name("grid")
                .Columns(columns =>
                {
                    columns.Bound(e => e.AssessmentID).Width(110);
                    columns.Bound(e => e.AssessmentName).Width(110);
                })
                .Sortable()
                .Pageable()
                .Scrollable()
                .ClientDetailTemplateId("scorelist")
                .DataSource(dataSource => dataSource
                    .Ajax()
                    .PageSize(10)
                    .ServerOperation(false)
                )
                .Events(e => e.DetailInit("detailInit"))
)

<script id="listviewTemplate" type="text/kendo-tmpl">
    <div class="StudentResultItem">
        <p>#=ResultValue#</p>
    </div>
</script>
<script id="scorelist" type="text/kendo-tmpl">

    @(Html.Kendo().ListView<AssessmentScoreModel>()
                    .Name("Scores_#=AssessmentID#")
                    .TagName("div")
                    .ClientTemplateId("listviewTemplate")
                    .HtmlAttributes("class='StudentResultItems'")
                    .ToClientTemplate()
    )

</script>

 

Model:

    public class StudentResultModel
    {
        public int AssessmentID { get; set; }
        public string AssessmentName { get; set; }
        public List<AssessmentScoreModel> ResultItem { get; set; }
    }

    public class AssessmentScoreModel
    {
        public int ResultID { get; set; }
        public string ResultValue { get; set; }
    }

 

 

When I run it, it can not show listview

[Boyan Dimitrov]

Hello sharon,

 

The problem with the provided code is caused by the fact that the ListView in the detail template is not populated with data. Its DataSource is actually empty. 

 

Based on the provided code I prepared a sample project that shows how to populate the ListView in the detailInit event. The main idea is to get the DataSource of the ListView and set its data based on the items stored in the gird dataItem. 

 

Regards,
Boyan Dimitrov
Telerik