accordion behavior in hierarchical grid

[Muhammad]

I have a hierarchical grid in which i want to have only one row expanded at a time.  

[Preslav]

Hi Muhammad,

Achieving the desired behavior will require the usage of the detailExpand event and the collapseRow method.

• https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-detailExpand
• https://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-collapseRow

For example, in the detailExpand event handler, get all the master rows without the one that invoked the event(e.masterRow). Then, use the collapseRow for every master row. The code could look like:

detailExpand: function(e) {
  var grid = e.sender;
  var rows = grid.element.find(".k-master-row").not(e.masterRow);

  rows.each(function(e){
    grid.collapseRow(this);
  });
},

For a runnable example, check my testing Dojo:

• http://dojo.telerik.com/ubUTi

Regards,
Preslav
Progress Telerik

[Muhammad]

Thanks