Multi level expandable table

đź’¬ App Building
1
  1. My goal: To be able to have multiple levels of nesting within the expandable row / group rows feature
  2. Issue: Only the first level is displayed, further are displayed as separate rows instead nesting them
  3. Steps I've taken to troubleshoot: Tried several features and combinations within the expandable content popup
  4. Additional info:

In the screenshot, you can see the “Pork” category, inside it has “Pork Ribs”. The “Pork Ribs” has inside also the “Pork another” category, but instead of being displayed behind the “Pork Ribs” first row, an additional “Pork Ribs” row is added at the end

image
image643Ă—406 11.8 KB

The structure of the data is simple:

 {
    "ingredientCategoryId": "921950e0-57e1-4b0c-ab2f-19c95bbb5730",
    "name": "Pork another",
    "parentIngredientCategoryId": "16bb134c-dc46-4724-9dff-e433653559d3"
  },
  {
    "ingredientCategoryId": "16bb134c-dc46-4724-9dff-e433653559d3",
    "name": "Pork Ribs",
    "parentIngredientCategoryId": "f1274dac-a9d4-4ee8-8030-7f41429ccda0"
  },
  {
    "ingredientCategoryId": "598f3592-9368-40a6-85e9-0277ca6be229",
    "name": "Pork Shoulder"
  },
2

I think you might be better server using a listview with a toggle link + container + expandable table in this situation

let me know if that makes sense!

1 Like
3

yes, but that requires a lot of manual work, because the parent cannot be mapped automatically… do you know if the table supports multi level elements? is there an open ticket for this in retool?