Multi level grid expand button doesn't show

1 Answer 29 Views
Grid
Martin
Top achievements
Rank 1
Iron
Martin asked on 26 Nov 2021, 10:27 AM

I'm trying to create a 3 level hierarchy grid, but for some reason the second level doesn't show the expand button.

The only reason the 3rd level is expanded in the pic is because of the dataBound script, which expands everything.

How do I make the second level expandable?

Here's the code:


@(Html.Kendo().Grid(Model.SalaryApprovalEmployments) .Name("grid") .Columns(columns => { columns.Bound(e => e.Id).Width(100); columns.Bound(e => e.TotalCost).Width(100); columns.Bound(e => e.Trend).Width(100); }) .DataSource(dataSource => dataSource .Ajax() .Model(model => { model.Id(sae => sae.Id); }) .ServerOperation(false) ) .Events(events => events.DataBound("dataBound")) .ClientDetailTemplateId("salaryCodeTemplate") .HtmlAttributes(new { style = "width:600px;" }) ) <script id="salaryCodeTemplate" type="text/kendo-tmpl"> @(Html.Kendo().Grid<SalaryApprovalTransactionDTO>() .Name("grid_#=Id#") .Columns(columns => { columns.Bound(o => o.SalaryApprovalEmploymentId).Width(100); columns.Bound(o => o.SalaryCodeId).Width(100); columns.Bound(o => o.Amount).Width(100); }) .DataSource(dataSource => dataSource .Ajax() .Model(model => { model.Id(sat => sat.SalaryCodeId); }) .Read(read => read.Action("HierarchyBindingTransactions", "SalaryApproval", new { salaryApprovalGroupId = Model.Id, salaryApprovalEmploymentId = "#=Id#" })) ) .Events(events => events.DataBound("dataBound")) .ClientDetailTemplateId("transactionTemplate") .ToClientTemplate() ) </script> <script id="transactionTemplate" type="text/kendo-tmpl"> @(Html.Kendo().Grid<SalaryApprovalTransactionDTO>() .Name("grid_#=SalaryApprovalEmploymentId#_#=SalaryCodeId#") .Columns(columns => { columns.Bound(o => o.SalaryCodeId).Width(100); columns.Bound(o => o.UnitPrice).Width(100); columns.Bound(o => o.Hours).Width(100); columns.Bound(o => o.Days); columns.Bound(o => o.Amount).Width(100); }) .DataSource(dataSource => dataSource .Ajax() .Model(model => { model.Id(sat => sat.Id); }) .Read(read => read.Action("HierarchyBindingTransactions", "SalaryApproval", new { salaryApprovalGroupId = Model.Id, salaryApprovalEmploymentId = "#=SalaryApprovalEmploymentId#", salaryCodeId = "#=SalaryCodeId#" })) ) .ToClientTemplate() ) </script> <script> function dataBound() { var grid = this; this.tbody.find("tr.k-master-row").each(function( index ) { grid.expandRow(this); }); } </script>

1 Answer, 1 is accepted

Sort by
0
Accepted
Martin
Top achievements
Rank 1
Iron
answered on 26 Nov 2021, 02:51 PM

Turns out that someone decided to set it to "display: none" in a css.

It works, as intended.

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