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

How to use any if condition using clientTemplate in child grid of kendo UI Grid Hierarchy?

1 Answer 963 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:41 AM

I was implementing some "if condition" in child grid of kendo UI Grid Hierarchy using clientTemplate.when i used if condition in master grid using clientTemplate then it works fine for me. but when i use same code in child grid of of kendo UI Grid Hierarchy then showing "Invalid Template" Refference link 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"))
                                            )
                                    )
 
                                    <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 to add some condition using client template*
                                                    columns.Bound(p => p.OrderNumber).Groupable(false).Width("200px").Title("Order #").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.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#" }))
                                                )
                                                .Pageable()
                                                .Sortable()
                                                .ToClientTemplate()
                                        )
                                    </script>

 

 

1 Answer, 1 is accepted

Sort by
0
Alex Hajigeorgieva
Telerik team
answered on 19 Sep 2018, 08:41 AM
Hello, Dipty,

Thank you for the provided snippet and for trying out the Kendo UI Professional suite.

The issue you are experiencing is most likely due to the need to escape the child grids template as you have discovered in the forum thread at:

https://www.telerik.com/forums/kendo-master-auto-increment-id-showing-in-child-grid-when-using-clienttemplate-of-kendo-ui-grid-hierarchy-in-c-mvc-5e235a710fbd#hSOhKIqoIUqyB9lQTmiu5w

.ClientTemplate("<a \\#if(DisplayDistribution){\\# class='OrderHover'\\#}\\# data-id='\\#= OrderID\\ #' href='javascript:void(0);' style='float:left;' onclick='OpenOrderDetailsPopup(\\#= OrderID \\#, 0);'> \\#=OrderNumber\\# </a>");

Kind Regards,
Alex Hajigeorgieva
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Grid
Asked by
Dipty
Top achievements
Rank 1
Answers by
Alex Hajigeorgieva
Telerik team
Share this question
or