Collapse/expand the rows inside a grid based on column

Question

Hi Everyone, 
 I am having a requirements can anyone tell me whether it is possible or not. 
 I am having a paging grid of 10 columns in that grid I need to group by 3 columns (manager , order type , symbol) 
 Here order by means for example if I am having 4 manager's each manager having 10 tasks that means grid contains 40 rows 
 now based on my requirements it should only show 4 rows(in the grid), If I click on any of the manager name (manager column should be in dynamic link) then it should show all the rows which is assigned to that particular manager , that means it should act like collapse. 
 The same way order type & symbol columns should work 
 
 Do we have any plugs for this requirement?

Dave Lewis · Answer

Define a local variable that shows all the contents of the highest level grid (managers and tasks, in your case). Next define another local variable for a selected manager, a boolean flag for when manager is selected, another local variable that if a manager is selected stores the contents of the filtered grid. Finally, a local variable that stores the grid for display. About all of these will have to be set up with a!refreshVariables. 
 The local variable that stores the grid for display is defined as: if ( managerSelected, local!filteredGrid, local!highLevelGrid) 
 When the user clicks on a manager, the local variable definition of filtered grid will most likely have to fire off a helper rule you write to create the additional rows to display for that manager. You might consider the type() function in a a!forEach loop to make them, and then the insert() function to place the new rows into the exact position under the selected manager. 
 You also need to think of how to de-select a manager, and then likely reset local!filteredGrid to null or empty list. Or maybe you don't need to, and you can simply overwrite it when you make a new one selecting a new manager. 
 This is all super, super high level, but you can design with what you have on hand to do what you want. This is going to be something like a minor Epic for your team, so take your time. 
 A bare bones, nothing mock-up as part of a SPIKE might be your best first run at this. I'm talking dummy data {"A","B","C"} that can get "Apple", "Asparagus", "Aligator" to display when you click "A". Then, if you can get "Carrot", "Camel", "Crocodile" to display when you click "C" instead, you've made it.