Hi! I'm trying to work through a UI to show and interact with a recursive CTE SQL query. The depth of these relationships is determined by the end user and not controlled ahead of time.
My initial go at this was to create a view and recursively embed multiples of these views with a main view to build out a tree. I quickly learned that views cannot be nested into themselves. Given that self-nesting cannot occur, I'm pursuing the following as options:
Programmatically placing components in components at run time. Honestly, not sure if this is possible. This would be targeting placing accordions within accordions or tables within tables using subview expansion. This would seek to work around the issue of embedding views by just embedding elements. I suspect that subviews within tables would generate similar complaints though.
Alternatively Tree or MenuTree. Both of these have allowances for multiple levels of items, which is a great start. Unfortunately, they only appear to be able to show text and an image, and do not provide the functionality I'm looking for. Ideally, I would like the items to be views driven by the item data. Ideally, these could be lined up in a column wise fashion.
I thought it would be better to ask you lovely folks where I might be able to proceed before heading deep down either path only to hit a dead end.
As visual reference, the UI of WinDirStat or MSProject is essentially what I am shooting for. You can see that each contains parent/child references, but each line has a complex view associated with it. In addition, data elements are lined up vertically.
Thank you for any help!
On my quick read through of your needs, I would assume you could develop a "Row" as a view that can take parameters that transform it to look like any of the individual rows you want to display, indent, images etc. I would then use a flex repeater to instantiate the "Row" as many times as needed:
https://docs.inductiveautomation.com/display/DOC81/Perspective+-+Flex+Repeater
You could use a script to populate the parameters of the flex repeater to generate the instances and parameters to set the indent/image/text of the views you need. You could bind the script to an onChange event for a bound SQL query to get the data on load of the page.
Obviously this is a very simple explanation for what would be relatively complex to explain in detail, but I believe it is a possible way to get the result you are after.
I would expect that there is a smarter person in this community that has a better solution, but failing that, this might get you across the line.
1 Like
I'm sure there was a thread in the past couple of days (but I can't find it) saying that nesting views (in general) more than one level deep caused big delays in browser rendering as everything has to get moved around every time a new embedded view is "discovered". I can't find the post.
I don't think you're going to find a responsive solution using standard Perspective components but maybe someone will have an idea.
What if you split this up into two components - the Tree component on the left and then a Perspective Table or a Column Flex Repeater on the right? One benefit of this is that it would also allow you to easily line up your columns, like you want. I think, visually, that might get you close, but what would be tricky doing it this way is that you'd need to synchronize the selection in the tree with the component you choose to use on the right.
