Problem with Hierarchical Grid

[Paul]

Hi,

I am attempting to generate a hierarchical grid. I want the child rows to be rendered in html e.g. as links, buttons etc. But when i do this, the values rendered for each row are those of its parent record. Is this a bug? have i done something wrong?

Any help would be greatly appreciated. The code i am using on my razor view is below:

@(Html.Kendo()

    .Grid(Model.Items)

    .Name("Grid")

    .Pageable(pager => pager.Input(false).Numeric(true).Info(true).PreviousNext(true).Refresh(false))

    .HtmlAttributes(new { @class = "datatable" })

    .DataSource(dataSource => dataSource.Ajax().ServerOperation(false).PageSize(250).Events(events => events.Error("paging_OnError")).Model(model => { model.Id(p => p.Id); }))

    .Filterable(filter => filter.Enabled(false))

    .Navigatable()

    .Scrollable(resize => resize.Enabled(false))

    .Resizable(resize => resize.Columns(false))

    .Reorderable(reorder => reorder.Columns(false))

    .Sortable(sorting => sorting.SortMode(GridSortMode.SingleColumn))

    .Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple).Type(GridSelectionType.Row))

    .ColumnMenu(menu => menu.Enabled(true))

    .Columns(columns =>

    {

        columns.Bound(m => m.Id).ClientTemplate("<input id='checkedRecords' type='checkbox' value='#=Id#' />").Title("").Width(10).HtmlAttributes(new { style = "text-align:center", @class = "checkBox" }).HeaderTemplate(@<text><input type="checkbox" title="check all rows" id="checkAllRows" style = "text-align:center;"/></text>).HeaderHtmlAttributes(new { style = "text-align:center;" }).Filterable(false).Sortable(false).IncludeInMenu(false);

        columns.Bound(m => m.PublicationDate).Title("Publication date").Width(130).Filterable(true).Sortable(true);

        columns.Bound(m => m.Title).Title("Title").ClientTemplate("<a href='Article/Detail/#=Id#' alt='' target='_blank'>#=Title#</a>").Filterable(true).Sortable(true);

    })

        .ClientDetailTemplateId("customTemplate")

)

 

<script id="customTemplate" type="text/kendo-tmpl">

    @(Html.Kendo()

        .Grid<Model.ResultModel>()

        .Name("#=Id#")

        .Sortable(sort => sort.Enabled(false))

        .Columns(columns =>

        {

            columns.Bound(m => m.Id).ClientTemplate("<input id='checkedRecords' type='checkbox' value='#=Id#' />").Title("").Width(10).HtmlAttributes(new { style = "text-align:center", @class = "checkBox" });

            columns.Bound(m => m.PublicationDate).Title("Publication date").Width(130);

            columns.Bound(m => m.Title).Title("Title").ClientTemplate("<a href='/Article/Detail/#=Id#' alt='' target='_blank'>#=Title#</a>");

        })

        .DataSource(dataSource => dataSource

                        .Ajax()

                        .Read(read => read.Action("GetChildren", "Grid", new { Count = "#=Count#" }))

                        .Model(model => { model.Id(m => m.Id); })

                    )

        .ToClientTemplate()

    )

</script>

[Simon]

Escape # in ClientTemplate to reference properites of child grid, like this: "\\#= Id \\#". 

I had exactly the same problem today. ;)