Some thoughts about your questions.
If the surveys are from a dynamic collection you only need one page, pass the data of the current survey to the page (variable/query) and show the data the way you prefer. In this case you don’t need a “collection page”.
My understanding is that the data grid needs a fixed shape of data so it’s not for your case unless you know that the surveys have a fixed set of shapes so that you can configure multiple data grids to accommodate them.
You can use the custom HTML element or create a custom plugin following the developers’ documentation. Personally I prefer the custom plugin because it is more powerful and the dx is better.
As an alternative you can construct a dynamic table just nesting weweb containers and column.
- create a container with vertical direction
- In the container insert a columns element for the header, set the items to the array of keys, add a text in every cell
- copy the header, remove the text in the cells and add another columns element set to row
- set the row items to be a map of the values with the key of the current column item
Of course this requires effort to style it in the proper way (especially if you have a lot of columns), and depends on the way you structure the data.
I made a basic example. You can extend this with other requirements you may need (eg column title different from keys in the values object)
