Using kendo Grid Jquery - want to add details expansion panel to some rows

[paul]

Hello,

we have the kendo grid jquery working. And now want to add a details expansion panel to some rows.

The example I will follow is here

 

https://demos.telerik.com/kendo-ui/grid/detailtemplate

 

I have a question, not all table rows will have a details row, which depends on a data field value.  How and where in the init of the details panel to add this logic to either add the details row or not add it.

Example code would be greatly appreciated.

 

 

Thanks

Paul

[Georgi Denchev]

Hi, Paul,

The detail row will not be initialized until it is expanded. In this scenario you can remove the Expand icon from the rows that you don't wish to have a detail template.

Example using the dataBound event:

                dataBound: function() {
                  let grid = this;
                  let data = grid.dataSource.view();
                  
                  data.forEach(function(x, i) {
                    // Remove the hierarchy icon based on the data in the row.
                  if(x.FirstName == "Nancy") {
                      let row = grid.tbody.find("[data-uid='"+x.uid+"']");
                      // Find the expand icon in the row and remove it.
                      row.find(".k-i-expand").remove();
                    }
                  });
                }

Runnable Dojo:

https://dojo.telerik.com/aqUPuRUZ 

Let me know if you have any questions.

Best Regards,
Georgi Denchev
Progress Telerik