This is a migrated thread and some comments may be shown as answers.

Kendo master auto increment id showing in child grid when using clientTemplate of kendo UI Grid Hierarchy in C# MVC

1 Answer 591 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Dipty
Top achievements
Rank 1
Dipty asked on 17 Sep 2018, 08:36 AM

I was implemented kendo Grid Hierarchy in my list page. but when i list child item without client template then auto increment id of each item showing properly but when i use clientTemplate property of kendo grid in child grid to show auto increment id then only auto increment id of parent item was showing. Example showing on bellow https://demos.telerik.com/kendo-ui/grid/hierarchy

 

@(Html.Kendo().Grid(Model.OrderList)
                                        .Name("Grid")
                                        .Columns(columns =>
                                        {
                                            columns.Bound(p => p.OrderID).Width("50px").Sortable(false).Filterable(false).Title("<input type='checkbox' id='chkSelectAll' onchange='SelectAll();'/>").ClientTemplate("<input type='checkbox' id='orderselect_#=OrderID#' class='orderselect' value='#=OrderID#' onchange='chkOrUnchk(this)'/>");
 
                                        })
                                        .Resizable(r => r.Columns(true))
                                        //.Reorderable(r => r.Columns(true))
                                        .Selectable(selectable => selectable.Mode(GridSelectionMode.Multiple).Enabled(true))
                                        .Events(events => events.Change("Grid_OnRowSelect").DataBound("OrderGrid_OnDataBound").ColumnReorder("Grid_OnColumnReorder"))
                                        .Pageable(settings => settings.PageSizes(new int[] { 25, 50, 100, 500 }))
                                        .Sortable()
                                        .Scrollable(s => s.Virtual(false).Height("600px"))
                                        .Filterable()
                                        .ClientDetailTemplateId("childOrders")
                                        .DataSource(dataSource => dataSource
                                                    //.Server().Model(model => model.Id(p => p.OrderID))
                                                    .Ajax()
                                                    .PageSize(Model.DefaultOrderPageSize)
                                                    .Read(read => read.Action("ManageOrderLoadForGridAjax", "Order").Data("OrderSearchParameter"))
                                        )
                                )
 
                                Child Grid
                                <script id="childOrders" type="text/kendo-tmpl">
                                    @(Html.Kendo().Grid(new List<SMOrderNew>())
                                            .Name("grid_#=OrderID#") // template expression, to be evaluated in the master context
                                            .Columns(columns =>
                                            {
                                                // *i want child order number but return parent order number using client template*
                                                columns.Bound(p => p.OrderID).Width("50px").Sortable(false).Filterable(false).ClientTemplate("<input type='checkbox' id='orderselect_#=OrderID#' class='orderselect' value='#=OrderID#' onchange='chkOrUnchk(this)'/>");
                                                columns.Bound(p => p.OrderNumber).Groupable(false).Width("200px").Template(@<text></text>).ClientTemplate("<a #if(DisplayDistribution){# class='OrderHover'#}# data-id='#= OrderID #' href='javascript:void(0);' style='float:left;' onclick='OpenOrderDetailsPopup(\"#= OrderID #\", 0);'> #=OrderNumber# </a>");
                                                //columns.Bound(p => p.StoreName).Title("Store").Width(100).Template(@<text></text>).ClientTemplate("<div style='background:url(\"#=StoreImage_Icon#\") no-repeat left -2px; padding-left:20px;'>#=StoreName#</div>");
                                                columns.Bound(p => p.BuyerUserID).Width("200px").Title("Buyer User ID").HtmlAttributes(new { style = "white-space: nowrap;" });
                                            })
                                            .Events(events => events.Change("Grid_OnRowSelect").DataBound("OrderGrid_OnDataBound").ColumnReorder("Grid_OnColumnReorder"))
                                            .DataSource(dataSource => dataSource
                                                .Ajax()
                                                .PageSize(100)
                                                .Read(read => read.Action("ManageChildOrderLoadForGridAjax", "Order", new { OrderId = "#=OrderID#" }))
                                            )
                                            //.ClientDetailTemplateId("attributeOption")
                                            .Pageable()
                                            .Sortable()
                                            .ToClientTemplate()
                                    )
                                </script>

1 Answer, 1 is accepted

Sort by
0
Dipty
Top achievements
Rank 1
answered on 18 Sep 2018, 07:55 AM

i found the solution escape characters has to be used inside while using childtemplate as shown in sample :

 

columns.Bound(o => o.ShipAddress).ClientTemplate("\\ #= ShipAddress \\ #"); // escaped template expression, to be evaluated in the child/detail context

Tags
Grid
Asked by
Dipty
Top achievements
Rank 1
Answers by
Dipty
Top achievements
Rank 1
Share this question
or